Nach mehreren Monaten Entwicklung ist der neue Internetauftritt für des Börse-Aktuell Verlags jetzt online. Die WordPress-Installation muss dabei über 30.000 Aufrufe am Tag verarbeiten und über 24.000 registrierten Nutzer verwalten. Bei diesen Zahlen war mir klar, dass ich den Webserver das Unternehmens so gut wie möglich entlasten muss, um eine gute Performance der Website zu gewährleisten. Im Folgenden will ich auf die Methoden eingehen, welche ich zur Optimierung verwendet habe.
Beiträge pro Seite reduzieren
Je mehr Beiträge auf einer Seite angezeigt werden, umso länger lädt diese Seite auch. Bei den einzelnen Beitragsseiten ist dies kein Problem, da immer nur ein Beitrag geladen wird. Bei Übersichtsseiten, welche die Vorschau von mehreren Beiträgen laden, geht die Performance jedoch schnell den Bach runter. Deswegen habe ich zum Beispiel den Börsen-Ticker des Verlags so programmiert, dass immer nur 10 Beiträge geladen werden. Um weitere Beiträge zu sehen, muss der Besucher entweder ans Ende der Seite scrollen oder in der Paginierung auf die nächste Seite wechseln. Die folgenden 10 Artikel werden dann dynamisch per AJAX geladen. Diese Nachladefunktion kann auch sehr einfach mithilfe des Plug-ins „Content Views“. Mit diesem Plug-in kann man Beiträge wie auf einer Kategorie-Seite anzeigen und weitere Artikel über AJAX nachladen lassen.
Zu große Bilder
Bilder erhöhen die totale Netzwerknutzlast enorm. Deswegen komprimiere ich zunächst alle Bilder mit der Windows-Anwendung „Caesium“. Diese Anwendung bietet viel Flexibilität und ermöglicht es, alle Bilder in einem Ordner auf einmal zu komprimieren. Dabei kann man Qualität, Outputformat, Resizing und Prefixes einstellen, was sehr nützlich sein kann. Außerdem achte ich darauf, die richtigen Bildformate zu wählen. Die genaue Größe der Bilddateien kommt natürlich auf den Inhalt und die Kompressions-Methode an. Generell verwende ich aber die Hierarchie: SVG, JPEG, PNG. SVGs benutze ich sehr gerne, da diese als Vektordateien unglaublich sparsam sind. Alle Icons und Illustrationen werden deswegen als SVG eingebunden.
Sollte es sich um ein Foto oder Bilder handeln, benutze ich das JPEG Format. Dieses ist in der Regel kleiner als ein PNG, hat aber dafür keine Transparenz. Das sehr sparsame Bildformat WEBP verwende ich noch nicht, da es nicht überall unterstützt wird.
Diese Optimierungen sollte man nicht nur für bestehende Bilder, sondern auch für neue Bilder anwenden. Damit ich die Website von Börse-Aktuell nicht permanent überprüfen muss, nutze ich WP Optimize. Dieses Plug-in erlaubt es mir, alle Bilder, welche von der Reaktion hochgeladen werden, automatisch zu komprimieren. Außerdem läuft die Komprimierung im Hintergrund über Cron-Jobs, was die Serverressourcen schont.
Zu viele Plugins
Außerdem muss man unbedingt prüfen, ob alle Plug-ins wirklich benötigt werden. Für viele kleinere Funktionen benötigt es oft kein ganzes Plug-in, sondern es reicht ein Shortcode in der functions.php des eigenen Child-Themes.
Code Optimieren & Caches
Des Weiteren gibt es die Möglichkeit, den eigenen Javascript- und CSS-Code bereits beim Entwickeln zu optimieren und nur die minimierten Dateien auf den Webserver hochzuladen. Dafür gibt es je nach Entwicklungsumgebung unzählige Plug-ins. Am besten im Marketplace der eignen Entwicklungsumgebung nach „Minify“ suchen und dann je nach Programmiersprache ein geeignetes Plug-in aussuchen.
Trotz dieser Tools bindet WordPress häufig Ressourcen ein, welche nicht vom Entwickler stammen. Manchmal stoße ich zum Beispiel auf nicht optimierte CSS- und Javascript-Dateien von Parent-Themes und Plug-ins.Diese lasse ich dann durch das Autooptimize-Plug-in automatisch minimieren. Autooptimize verwende ich gerne, da es sehr einfach zu handhaben ist und es die minimierten Dateien gleich als Cache bereitstellt. Außerdem bietet es die Möglichkeit, Bilder verzögert zu laden. Bei vielen Bildern gibt diese Option einen weiteren Performance-Boost.
Website immernoch zu langsam?
Sollte deine Website trotz mehrerer Optimierungsversuche immer noch extrem langsam sein, ist es wahrscheinlich an der Zeit, eine bessere Hardware anzumieten. Die oben beschrieben Methoden steigern zwar die Performance einer WordPress-Seite, sind jedoch keinesfalls Ersatz für einen angemessenen Webserver, der zur Größe deiner Website passt.
