Betriebssysteme, Programme & Web

Wie ich die Ladezeit des Blogs um 90% reduziert habe

Es gibt viele WordPress Plugins, die die Performance des Blogs erhöhen sollen. Dazu zählen beispielsweise Cachify, WP Super Cache, Hyper Cache Extended und viele mehr. In diesem Beitrag werde ich euch W3 Total Cache vorstellen, da ich mit diesem Plugin die besten Ergebnisse erzielen konnte und man sehr viele Einstellmöglichkeiten hat. Ich werde euch also die optimalen W3 Total Cache Einstellungen verraten.

Eine gute Ladezeitoptimierung ist in der heutigen Zeit nicht nur für die Besucher sehr wichtig, die abspringen, wenn die Ladezeit zu lange dauert, sondern auch für die Suchmaschinenoptimierung, denn die letzten Google Updates wie Penguin und Panda berücksichtigen auch die Geschwindigkeit der Seite.

Es gibt viele Wege um eine Website schneller zu machen – dazu gehört nicht nur ein schneller Server, sondern auch die Website muss optimiert werden. Dies geschieht vor allem mit Caching, Database Caching, Object Caching und Minifying. W3 Total Cache bietet dies alles an, somit braucht man sich nicht alles einzeln zusammen suchen. Doch lasst uns nun mit dem Tutorial über die W3 Total Cache Einstellungen anfangen.

Nachtrag: W3 Total Cache ist ein Schwergewicht und bietet sehr viele Einstellmöglichkeiten. Eine optimale Konfiguration ist nur für Profis möglich, daher empfehle ich inzwischen andere Plugins, wie etwa WP Rocket, Cache Enabler oder WP Fastest Cache. Probiert am besten einfach mal aus, ob eines der Plugins nicht schon für eure Bedürfnisse ausreicht. Die hier vorgestellten Einstellungen können für euren Server auch vollkommen verkehrt sein und die gerade genannten drei Plugins sind sehr einfach zu bedienen und leisten schon großartige Arbeit. Ihr spart euch dadurch jede Menge Zeit zur Optimierung, habt bei WP Rocket beispielsweise auch noch einen hervorragenden Support und könnt euch ganz auf eure Bloginhalte konzentrieren.

Verringerung der Ladezeit um 90%

Wie ich bereits im Titel des Tutorials geschrieben habe, habe ich die Ladezeit unseres Blogs um 90% reduziert. Ich habe schon einige Cache Plugins ausprobiert, doch keines hat so ein überragendes Ergebnis wie W3 Total Cache geliefert.  Es ist natürlich nicht gesagt, dass das gleiche Ergebnis erzielt, allerdings kann man mit dem Plugin W3 Total Cache schon eine Menge erreichen. Ich hoffe ihr kommt auf ähnliche Ergebnisse. Hier ist meine Veränderung bei der Ladezeit:

Ladezeit vor der Optimierung
Ladezeit vor der Optimierung
Ladezeit nach der Optimierung
Ladezeit nach der Optimierung

W3 Total Cache

  1. Installiere und aktivere das Plugin W3 Total Cache.
  2. Optional kannst du deine Ladezeit vorher nochmal messen, mit beispielsweise Pagespeed.de oder Seitenreport.de. Seitenreport ist ein wenig ausführlicher, hat dafür jedoch eine Testbegrenzung drin.

Jetzt können wir die Einstellungen vornehmen. Da das Plugin auf Englisch ist, werde ich auch die englischen Texte verwenden. Außerdem werde ich lediglich Änderungen auszeigen, die von der Standardkonfiguration ausgehend gemacht werden sollten. Sollte etwas nicht in diesem Tutorial stehen, lass es einfach auf der Standardkonfiguration.

General Settings bei W3 Total Cache

  • Aktiviere „Page Cache“ indem du einen Haken bei „Enable“ reinmachst. Wähle bei Page cache method „Disk: Enhanced“ oder wenn es anklickbar ist „Opcode: Alternative PHP cache“ aus.
  • Aktiviere „Minify“, auch wieder durch einen Haken bei „Enable“. Setzte den „Minify mode“ auf „Manual“ und „Minify cache method“ auf „Disk“ oder wenn möglich auf „Opcode: Alternative PHP cache“.
  • Ob sich „Database Caching“ bei dir lohnt musst du ausprobieren. Aus Erfahrung kann ich sagen, dass es sich bei SSD-Webspace nicht lohnt. Um es zu nutzen aktiviere „Database Caching“ durch einen Haken bei „Enable“ und wähle bei „Database Cache Method“ „Disk“ aus. Du musst vermutlich außerdem noch deine wp-config.php schreibbar machen, das zeigt dir das Plugin auch beim abspeichern an.
  • Lass „Object Caching“ deaktviert – Durch die Aktvierung wird das Frontend zwar ein wenig schneller (für eingeloggte Benutzer), das Backend jedoch extrem langsam
  • Aktiviere „Browser Cache“, um die Anfragen bei mehreren Seitenaufrufen zu minimieren.
  • Aktiviere unter „Miscellaneous“ den Punkt „Verify rewrite rules“.

Optional kannst du auch noch die Option „Optimize disk enhanced page and minify disk caching for NFS“. Diese Option hilft bei manchen Webhosting Providern, die viele Kunden auf einem Server haben.

Page Cache durch W3 Total Cache

  • Aktiviere „Cache front page“.
  • Aktiviere „Cache feeds: site, categories, tags, comments“.
  • Aktiviere „Cache SSL (https) requests“.
  • Aktiviere „Cache requests only for www.yoursitename.de site address“.
  • Aktiviere „Don’t cache pages for logged in users“.

Cache Preload

  • Aktiviere „Automatically prime the page cache“.
  • Setze den „Update interval“ auf 500 Sekunden.
  • Setze den „Pages per interval“ auf 30. Die Zahl muss angepasst werden, je nach Qualität des Hostings. Bei viel Rechenpower kann sie höher, sonst niedriger – einfach ausprobieren.
  • Gib deine Sitemap URL an.
  • Aktiviere „Prime post cache on publish“

Advanced

  • Setze „Garbage collection interval“ auf 3600 Sekunden.

Minify durch W3 Total Cache

  • Aktiviere „Rewrite URL structure“
  • Setze „Minify error notification“ auf deine gewünschte Benachrichtigungsart, wenn Fehler auftreten sollten.

HTML & XML

  • Wähle „Enable“, „inline CSS minification“, „inline JS minification“ und „line break removal“ aus.

JS

Das ist der schwierigste Teil der W3 Total Cache Einstellungen. Man muss einfach ausprobieren und sobald ein Fehler auftritt wieder zurück gehen. Ich würde das nur empfehlen, wenn der Rest nicht ausreicht. Ich habe es bei mir auch nicht aktiviert, da es bei mir Probleme mit dem Plugin Crayon Syntax Highlighter gab.

  • Wähle „Enable“, „preserved comment removal“ und „line break removal“ aus.
  • Wechsel in den Quellcode deiner Seite (vorzugsweise die Startseite) und suche dir jede JS-Datei raus und füge den Link unter „JS file management“ ein. Wie gesagt, du musst ein wenig ausprobieren also füg am besten nicht alle auf einmal ein.

Tipp: Wenn das Theme JS-Dateien beinhaltet würde ich die nicht einfügen, die führen meistens zu Problemen.

CSS

  • Wähle „Enable“, „preserved comment removal“ und „line break removal“ aus.
  • Wechsel in den Quelltext deiner Seite und suche alle CSS-Dateien raus und füge sie einzeln unter „CSS file management“ ein.
  • Wenn du merkst, dass eine Datei dabei dein Layout zerstört, lösche sie wieder raus.

Advanced

  • Setze „Update external files every“ auf 216000 Sekunden.
  • Setze „Garbage collection interval“ auf 216000 Sekunden.

User agent groups unter W3 Total Cache

  • Aktiviere es einfach nur und ändere nichts.

Das Ergebnis nach der Optimierung durch W3 Total Cache

Nun ist es an der Zeit das Ergebnis der Optimierung festzustellen. Nutzt dafür einfach das gleiche Tool zur Ladezeitmessung wie vor Beginn der Optimierung.

Wenn du Fragen oder Probleme bei dem Tutorial hast, stehe ich natürlich gerne zur Verfügung, ansonsten hoffe ich, dass W3 Total Cache bei euch ähnliche Ergebnisse liefert und bin auf eure Ergebnisse gespannt. Lasst es mich bitte wissen wie eure Seite danach läuft. 😉

 

EDIT: Ich habe einen neuen Artikel zu W3 Total Cache geschrieben um das Thema CDN zu behandeln! Diesen findest du unter: Beschleunige deinen WordPress Blog durch ein CDN

EDIT2: Seit einigen Monaten verwenden wir übrigens kein W3 Total Cache mehr, sondern WP Rocket. Damit haben wir bessere Ergebnisse erzielt und es ist wesentlich einfacher zu konfigurieren. Zwar zahlt man für das Plugin auch etwas, dafür bekommt man jedoch auch erstklassigen Support geboten.

Simon Lüthje

Ich bin der Gründer dieses Blogs und interessiere mich für alles was mit Technik zu tun hat, bin jedoch auch dem Zocken nicht abgeneigt. Geboren wurde ich in Hamburg, wohne nun jedoch in Bad Segeberg.

Ähnliche Artikel

Schreibe einen Kommentar

Schaltfläche "Zurück zum Anfang"