Vor wenigen Tagen kontaktierte mich die Wiener Social-Media-Expertin Natascha Ljubic. Grund der Kontaktaufnahme war ihre extrem langsame WordPress-Website www.wds7.at. Grund genug die Ärmel hoch zu krempeln und der Website einen ordentlichen Geschwindigkeits-Schub zu verpassen. In diesem Blogartikel verrate ich was ich unternommen habe um der Website Beine zu machen.

Persönliche Zielsetzung: Weder FTP einsetzen noch hohen Aufwand betreiben!

Mein persönliches Ziel war eine Optimierung rein über die WordPress-Oberfläche ohne Umweg über FTP und das Dateisystem. Eine Reihe von Plugins sollten mir zur Seite stehen. Zudem wollte ich den Aufwand möglichst gering halten. So galt es vorallem im späteren Verlauf manche Optimierungen abzuwägen Punkto Zeit/Nutzen-Verhältnis. Anders ausgedrückt: Lohnt sich der Aufwand für diese oder jene Optimierung überhaupt? Ziel war es zudem die gefühlte Geschwindigkeit für den Besucher deutlich zu erhöhen. Eine Erhöhung irgendwelcher Speed-Scores „auf Teufel komm raus“ war gar nicht gefragt.

Die erste Analyse: Fast 11 Sekunden Ladezeit

Mit dem kostenlosen Online-Tool Pingdom kann man kostenlos für jede beliebige Website einen zuverlässigen Geschwindigkeitstest durchführen. Bereits im ersten Durchlauf war klar, dass die Ladezeit von www.wds7.at mit durchschnittlich 11 Sekunden unerträglich hoch war. Da ich den Test mehrfach durchführte, stellte ich fest, dass manchmal sogar 20 Sekunden Wartezeit angesagt waren – Untragbar!

Maßnahme 1: Backup erstellen und WordPress aktualisieren

Um auf Nummer sicher zu gehen, bevor ich überhaupt unter der Motorhaube aktiv wurde, installierte ich das Plugin BackWPup und sicherte Dateien und Datenbank. Sicher ist sicher. Anschließend aktualisierte ich auf WordPress 3.9., die zum Zeitpunkt der Veröffentlichung aktuellste WordPress-Version (stabiler, schneller, sicherer).

Maßnahme 2: Cachify Plugin durch W3 Total Cache ersetzen

Die zweite Maßnahme tat mir im Herzen weh. Das Caching-Plugin Cachify von Sergej Müller gehört zu meinen Lieblings-Plugins und ist in den meisten Fällen auch die beste Wahl wenn man WordPress Beine machen möchte. Zwar ist das Plugin kinderleicht zu bedienen, wer aber bedeutend mehr Kontrolle und Einfluss haben möchte, stößt mit Cachify schnell an seine Grenzen.

Im Falle von www.wds7.at war die Menge an zu ladenden Dateien ein großes Problem. Um dieses Problem zu lösen, entschied ich den Boliden „W3 Total Cache“ zu installieren. Das Plugin gab mir einfach viel mehr Einstellungsmöglichkeiten als Cachify. Das Plugin ist übrigens recht mächtig (übermächtig?) und richtet sich eher an fortgeschrittene Nutzer.

Maßnahme 3: Kompaktere Dateien dank „Minify“

Eine im Plugin W3 Total Cache integrierte Funktion erlaubt das Bündeln von zahlreichen Javascript- und CSS-Dateien. Diese Funktion konnte mir Cachify nicht bieten. Browser laden jede Ressource einzeln herunter. Viele einzelne Dateien sind also immer schlechter als weniger aber dafür schwerere Dateien. Ein Bündeln von vielen Dateien reduziert also die so genannten „Requests“ (Anfragen) an den Server.

Minify beherrscht noch eine weitere Qualität, die wir uns Zunutze machen konnten: Dank Minify lassen sich Leerzeilen und Leerzeichen in HTML,CSS und Javascript eliminieren. Dadurch lassen sich die Dateigrößen noch einmal um rund 10% reduzieren.

[banner_praxisbuch]

Maßnahme 4: Page-Cache (Seiten-Cache) aktivieren

Via W3 Total Cache habe ich anschließend den Page-Cache aktiviert.

Dieser ist besonders mächtig und legt die fertigen HTML-Dateien in einem Verzeichnis im Dateisystem ab (diese Funktion beherrscht Cachify gleichermaßen). Ruft jemand eine Seite auf, wird nicht umständlich durch WordPress die Webseite zusammengestellt. Die Daten müssen also nicht erst aus der Datenbank geladen und zu einer HTML-Datei verpackt werden. Alles unnötig. Vielmehr wird eine fertige HTML-Datei ausgeliefert, ohne dass WordPress überhaupt „behelligt“ wird. Geschwindigkeitszuwachs (schnellere Auslieferung, HTML-Datei ist ja schon fertig) und Ressourcenschonung (Server wird weniger beansprucht) sind die Folge. Zwei Fliegen mit einer Klappe.

Maßnahme 5: Browser-Cache einrichten

Eine weitere Funktion betrifft den Browser-Cache. In W3 Total Cache lässt sich sehr genau einstellen, welche Ressourcen (Bilder, Javascript, CSS,…) wie lange durch die Browser der Besucher „gecached“ (also gespeichert) werden. Der Browser-Cache gilt als einer der wichtigsten Cache-Orte. Alles was im Browser-Cache bereits liegt, muss gar nicht erst „über den Äther“ beantragt werden. Kurzum: Alle Dateien (vorallem Javascript und CSS), die sich an sich nie ändern, können gerne für lange Zeit in den Browser-Cache gesetzt werden. Dadurch müssen Sie selbst wenn der Besucher ein paar Wochen später nochmal zurückkehrt, gar nicht mehr geladen werden.

Maßnahme 6: PHP aktualisieren

Damit die Website von Natascha Ljubic auf sicheren Beinen stehen konnte, habe ich in einer letzten Maßnahme die zugrundeliegende PHP Version aktualisiert. Unter der Haube werkelte noch eine recht betagte Version 5.3., die wir auf 5.4. aktualisieren konnten, da der Hoster dies entsprechend im Adminbereich des Hostings so vorsah (und ja, es gibt sogar bereits PHP 5.5., was wir allerdings aufgrund von möglichen Kompatibilitätsproblemen vermieden haben). Alte PHP-Versionen sollte unbedingt vermieden werden. Sie sind langsamer und vorallen Dingen bedeutend unsicherer als aktuelle Versionen.

Maßnahme 7: Unnötige Plugins entfernen und Plugins ersetzen

Klingt banal, ist aber so: Manche Plugins drücken gehörig auf die Spaß-Bremse. Daher gilt der Grundsatz bei Plugins: So viele wie nötig, so wenig wie möglich. Ich entfernte Plugins, deren Nutzen nicht unbedingt 100% gegeben war und ersetzte Plugins, die zuviel „Schmarrn“ in den Quellcode schrieben, durch sauberere Plugins. Vorallem „Social Sharing Erweiterungen“, die das bequeme Teilen auf Social-Media-Plattformen erlauben erweisen sich immer wieder als Lade-Bremsen. Raus damit und ersetzen: Zum Beispiel durch das Plugin „2 Click Social Media Buttons„. Die Buttons sind ressourcenschonend und datenschutzkonform.

Maßnahme 8: Datenbank aufräumen mit WP-Optimize

Ein Plugin ist besonders bequem: WP-Optimize. Es ist der Hausmeister im WordPress-Gebäude. Man installiert es, führt es aus und löscht es wieder. Es ist kinderleicht zu bedienen und mistet kräftig aus (keine Sorge, verloren geht so direkt nichts).

Massnahme 9: Bilder reduzieren

Eine weitere Massnahme zielte auf die geladenen Bilder ab. Ein Slider mit Fotos auf der Startseite wurde zu Gunsten einer schnelleren Website „eingestampft“. Die Fotos in der Mediathek wurden ebenfalls einer Optimierung unterzogen: Das Plugin „WP Smush It“ reduziert die Dateigröße von Fotos, ohne deren Qualität anzutasten. Das Schöne? Man kann das Plugin auch später installieren und mittels der eingebauten „Stapelverarbeitung“ alle Bilder in der Mediathek automatisch reduzieren lassen. Ausgezeichnet!

Das Ergebnis nach der Optimierung

Ladezeit auf 2.08 Sekunden gedrückt!

Geht da noch was?

Die Ladezeit ist bis dato noch immer nicht optimal. Dies liegt jedoch an der eher schwachbrüstigen Hosting-Konfiguration. An dieser Stelle könnte Natascha Ljubic noch etwas „herausholen“, wenn in Zukunft noch ein schnelleres Hosting-Paket gewählt würde.

Die Anzahl Requests ließen sich zudem noch reduzieren, wenn weniger einzelne Bilder genutzt würden. Zudem bereitete aufgrund der genutzten Plugins das „Bündeln“ der Dateien via „Minify“ Probleme. So mussten wir nachträglich die Bündelung rückgängig machen, womit nun gleich viele Anfragen (Requests) anfallen. Die zahlreichen Icons und Piktogramme könnte man zudem zu einem „Sprite“ (Erklärung auf Wikipedia) bündeln.