Pagespeed: Microcaching mit Nginx

Nginx ist für sich schon ein sehr schneller Webserver – er bietet jedoch noch einige interessante Funktionen für Caching, womit Zugriffe auf PHP minimiert werden und Seiten deutlich schneller ausgeliefert werden. Eine kurze Anleitung.

Für diesen Blog verwende ich als Basis die aktuelle Nginx-Mainline-Version 1.7.0 mit ngx_pagespeed-Module. Dafür musste ich nginx selbst kompilieren, was aber kein grundlegendes Problem darstellt und mit den entsprechenden Anleitungen auch auf einem aktuellen Debian-System schnell erledigt ist.

Pagespeed: Nginx + Memcached + PHP5-FPM

Nginx mit PHP5-FPM ist schon recht schnell, werden fertige Seiten mittels Memcached gespeichert lässt sich die Ladezeit noch weiter reduzieren. Die Umsetzung ist einfach.

Dieser Beitrag ist inspiriert von einer Anleitung auf 6tech.org und auf aktuelle Software-Versionen übertragen. Folgende Voraussetzungen müssen erfüllt sein, damit das Nginx-Setup von Memcached profitieren kann:

  1. nginx mit PHP5-FPM
  2. php5-memcached-Module installiert und aktiviert
  3. memcached muss installiert sein

Die Grundidee: statt der eigentlichen index.php wird ein Zwischenscript aufgerufen, welches den Aufruf an die eigentliche index.php weitergibt und das Ergebnis im Memcache ablegt. Dadurch erhält man auf einfachem Wege eine eine Caching-Lösung ähnlich des Plugins WP Supercache, bei der die die fertig erstellten Seiten hinterlegt werden. Dadurch ist im Falle eines Cache-Hits nur ein PHP-Aufruf nötig um das Memcache-Ergebnis auszuliefern – da die Daten im RAM abgelegt werden ist dies deutlich schneller als ein regulärer Aufruf.

Nginx mit SSL und SPDY

HTTPS korrekt aktiviert für kadder.de
HTTPS korrekt aktiviert für kadder.de (Google Chrome)

Wie einigen vielleicht aufgefallen ist, läuft mein Blog kadder.de neuerdings über eine verschlüsselte Verbindung (zu erkennen am HTTPS-Symbol in der Browser-Leiste). Hauptgrund für diese Umstellung, die leider etwas Zeit bei der First Byte Time kostet, war die Möglichkeit, Verbindung auch via SPDY für entsprechende Browser (z.B. Chrome) anzubieten. Außerdem hat es mich interessiert, wie sich die Umstellung der ganzen Domain auf SEO auswirkt – das wird sich aber erst in der nächsten Zeit zeigen.

Speed Index < 1000 mit Nginx, ngx_pagespeed, PHP, W3TC

Nginx-Logo
Nginx-Logo
Nichts ist nerviger als langsam ladende Webseiten – wer WordPress selbst hostet (in meinem Fall auf einem Cloudserver bei JiffyBox) hat jedoch etliche Luft für Optimierungen. Hier stelle ich einige vor.
Das Endergebnis vorweg: für die Blog-Startseite unter www.tech-blogger.net ermittelte Webpagetest.org am 09. November 2013 einen Speed-Index von 601 (kleiner ist besser, mehr Informationen zum Speed Index) für den „First View“ und 401 für den „Repeat View“. Das ganze für eine normale WordPress-Blog-Seite (Lightbox für Bilder, 10 Beiträge auf der Startseite, Bilder für Beiträge, Google Analytics) mit einem auf TwentyTwelve basierendem Theme (von mir etwas angepasst für SEO).

Webseite mit PageSpeed Service beschleunigen

Google hat es sich zum Ziel gemacht, das Internet schneller zu machen – für User also das Surf-Erlebnis zu verbessern. Dafür gibt es verschiedene Ansätze, zu einem der wichtigsten zählen die PageSpeed Insights, mit denen sich Bremsen bei der Auslieferung von Webseiten erkennen lassen. Dabei wird neben einzelnen Hilfen auch eine Gesamtpunktzahl angegeben, wie gut die jeweilige Seite optimiert ist.

PageSpeedService Architektur (Quelle: Google)
PageSpeedService Architektur (Quelle: Google)


nginx: Expires für Bilder

Nachdem ich erst versucht habe, nginx dazu zu überreden, nur Bilder über einen entsprechenden „location“-Block mit einem expires-Header zu versehen. Das hat leider nicht geklappt (Ergebnis: Bilder wurden nicht mehr gefunden). Lösung: für die globale location entsprechend gesetzt greifen die expires-Header (jetzt bei mir auf 8d gestellt).

location / {
root /var/www;
try_files $uri $uri/ /index.php;
expires 8d;
}

Das greift zumindest in meinem Fall für Bilder und andere statische Dateien, insbesondere Bilder. Dynamische Dateien wie PHP-Scripte werden dadurch nicht beeinträchtigt. Insgesamt ist dieser Blog jetzt auf einem Page Speed Score von 82/100, was auch durch das aktivierte Browsercaching begünstigt wird. Nächster Plan: JavaScript ans Ende der Seite verbannen und Bilder in Sprites kombinieren (um die Zahl der Requests weiter zu senken).

Nginx: GZIP aktivieren

Um die Datenübertragung zu beschleunigen und den Datentransfer zu minimieren sollte GZIP für JavaScript, CSS und HTML-Dateien aktiviert werden.

Per default ist Gzip nicht für alle relevanten Mimetypes aktiviert, sodass dies in der nginx.conf nachgeholt werden sollte (im http-Bereich hinzufügen):

gzip on;
gzip_disable "MSIE [1-6]\.(?!.*SV1)";
gzip_proxied any;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css text/xml application/x-javascript application/xml application/xml+rss text/javascript;
gzip_vary on;

Danach sollte Googles Pagespeed-Test eine deutliche Verbesserung zeigen – fehlende GZIP-Komprimierung wird dort nach wie vor als wirklich kritisches Problem eingestuft, welches nach aktiviertem Gzip besser wird. Mein nächster Plan: Cache-Zeiten via expires zu aktivieren, was derzeit bei diesem WordPress-Blog noch dazu führt, dass kein CSS mehr geladen wird.

Mehr zum Thema nginx und php gibt es im entsprechenden Blogpost. Nginx läuft mit GZIP problemlos und vollkommen stabil.

[amazon_link asins=’1491924772,1785280333,B00X40K8M8,B01GI4C982,B01L17AQZ4′ template=’ProductCarousel‘ store=’techbloggernet-21′ marketplace=’DE‘ link_id=’7b653bdf-d937-11e7-9c10-df7e40eff9dd‘]

nginx + PHP unter Debian (+ W3TC)

nginx ist ein schneller Webserver, der sich auch als Reverse Proxy oder zum Streaming von Flash-Videos einsetzen lässt. Ursprünglich entwickelt für die Anforderungen einer russischen Suchmaschine setzen auch immer mehr Webprojekte auf nginx. Anders als beim bekannten Apache-Webserver ist die Konfiguration von nginx unter Debian nicht ganz so simpel – es müssen noch Dateien von hand angepasst werden. Dieser Beitrag beschreibt die Basis-Änderungen, die nötig sind, um PHP5 mit Xcache als FastCGI-Einbindung unter Debian zum laufen zu kriegen. Die gezeigten Einstellungen sollten immer an die eigene Umgebung angepasst werden.

Installation
Mit folgendem Befehl werden die passenden Pakete installiert:

apt-get install php5-cgi php5-xcache php5-mysql nginx

Der mysql-Server ist in unserem Fall auf einem anderen Server untergebracht, ansonsten müsste zusätzliche noch das entsprechende Paket installiert werden. Der nächste Schritt ist die Einrichtung des nginx, wir behaltet dort weitgehenden den Debian-Standard bei. Mit dem Befehlt

/etc/init.d/nginx start

wird überprüft ob die Konfiguration bis hier hin funktioniert und der Webserver korrekt startet.

Konfiguration

Ist dies der Fall, müssen noch einige Anpassungen an der PHP-Einstellung für den jeweiligen Host sein (der Default-Host wird in „/etc/nginx/sites-available/default“ konfiguriert).

location ~ \.php$ {
fastcgi_pass 127.0.0.1:9000; #php läuft auf Localhost, Port 9000
#fastcgi_index index.php; #wird für diese Konfiguration nicht benötigt
fastcgi_param SCRIPT_FILENAME /var/www$fastcgi_script_name; #legt das Verzeichnis fest
include /etc/nginx/fastcgi_params;
}

In der fastcgi_params, die von Debian unter /etc/nginx angelegt wird, muss ebenfalls noch etwas geändert werden. Folgende Zeilen müssen auskommentiert werden:

#fastcgi_param SCRIPT_NAME $document_root$fastcgi_script_name;

Jetzt kann php-cgi alleine gestartet werden, um zu schauen ob alles funktioniert:

php-cgi -b 127.0.0.1:9000

Eine php-info-Datei in /var/www sollte jetzt Informationen zum installieren PHP zurückliefern. Gibt es die Meldung „no input file specified“ stimmt noch etwas mit den Verzeichnissen nicht. Funktioniert alles, kann das php-cgi-Startscript aus dem Nginx-Wiki übernommen werden und Einstellungen am XCache etc. vorgenommen werden. auch sollten wie im Wiki beschrieben Upload-Verzeichnisse geschützt werden, damit dort kein PHP ausgeführt werden kann.

Demnächst geht es hier weiter mit Redirects unter Nginx und Klartext-URLs mit WordPress (wie sie dieser Blog auch schon verwendet).