Dein WordPress ist langsam? Dann verschenkst du eine Menge Potenzial. Nicht nur deine Besucher:innen sind von der langsamen Ladezeiten genervt, du verlierst eventuell auch an Sichtbarkeit bei Google. Ich zeige dir Schritt für Schritt, wie du WordPress schneller machen kannst.
Wenn du über WordPress etwas verkaufst, zum Beispiel mit WooCommerce, dann gibt es genügend Untersuchungen, die bestätigen, dass langsame Websites unterm Strich weniger Umsatz machen. Vor allem mobile User brechen das Laden einer Seite ab, sollte es länger als drei Sekunden dauern. Schnellere Websites sind für dein Business überlebenswichtig.
E-Book WordPress schneller machen
Diesen Beitrag gibt es auch als E-Book, falls du ihn gebündelt lesen oder mit anderen teilen willst. Du findest „WordPress schneller machen“ hier als PDF zum Download.
Geschwindigkeit messen
Wer eine Website schneller machen will, der muss erstmal messen, wie schnell/langsam sie vor der Optimierung ist. Dabei ist die reine Ladezeit zwar wichtig, aber nicht unbedingt entscheidend. Manche Websites haben einfach große „Assets“ (zum Beispiel Bilder und Video), die die Besucher:innen auch sehen oder herunterladen wollen. Schneller ist immer besser, aber es kommt auch auf die Erwartungshaltung der Besuchenden an. Zum Beispiel apple.com hat notorisch schlechte Performance-Werte:
Das ist nicht gerade optimal. Dieser Umstand ist allerdings wohl begründet. Apple legt extrem hohen Wert darauf, dass die eigenen Produkte in der höchstmöglichen Qualität angezeigt werden und verwendet daher enorm große Bilder, ohne sie zu optimieren, wie diese Anleitung für WordPress zeigt. Besucher von Apple nehmen das in Kauf und warten gerne etwas länger auf das Laden der Seite.
Insgesamt fühlt sich die Performance der Apple-Seiten recht schnell an. Vor allem das Anzeigen der ersten Elemente ist in der Regel blitzschnell. Diese werden unter dem Aspekt „First Contentful Paint“ (FCP) gemessen. Der FCP entscheidet in der Wahrnehmung wie schnell sich das Laden einer Seite „anfühlt“. Daher kommt dem FCP bei der Optimierung eine besonders wichtige Rolle zu. Werte von 2 bis 3 Sekunden sollten nicht überschritten werden. Unter 2 Sekunden oder schneller ist besser.
Der „Largest Contentful Paint“ (LCP) spiegelt die Ladenzeit der restlichen Elemente aus dem Hauptcontent wider. Wer hier unter 3 Sekunden bleiben kann, der ist schon ziemlich gut. Große Produktbilder und ähnliche Assets können diesen Wert allerdings auch deutlich hochdrücken, was je nach Zweck auch völlig okay ist.
Der „First Input Delay“ (FID) misst die Zeit, die vergeht, bis deine Besucher:innen tatsächlich mit der Seiten interagieren können. Also zum Beispiel eine Textstelle markieren, einen Link oder Button klicken usw. Es könnte beispielsweise sein, dass eine Seite eine Suchbox hat. Vielleicht braucht diese Seite insgesamt 10 Sekunden, bis sie vollständig geladen ist. Wie schnell kann jemand die Suchbox anklicken und in das Feld tippen? Bedenke hierbei: Der „User“ ist nicht immer ein Mensch. Oft sind es auch Bots, die mit Seiten interagieren. Zum Beispiel der Google-Bot, der die Performance der Seite misst und diese Werte in die Berechnung der Rankings mit einfließen lässt.
Der „Cumulative Layout Shift“ (CLS) ist durchweg zu vermeiden. Sollte ein Layout während des Ladens „shiften“, kann das für deine Besucher:innen enorm irritierend sein. Klicks auf einen falschen Button können das Resultat sein. In den meisten Fällen werden solche Shifts durch fehlende Breiten- und Längenangaben (width/height) bei Bildern verursacht. Der CLS sollte immer 0 sein.
Diese vier Werte sind demnach entscheidend bei der Bewertung der Geschwindigkeit einer WordPress Website. Sie sind User-zentriert, also keine rohen Performance-Werte wie zum Beispiel Time to first byte, welcher bei der Beurteilung der Serverperformance bzw. der Verbindung zum Server eine große Rolle spielt. Das bedeutet auch, dass diese Werte weniger durch Caching und Auswahl für das WordPress Hosting bestimmt werden, selbst wenn dies für die WordPress Performance natürlich ebenfalls eine große Rolle spielt. Sondern eher durch den geschickten Aufbau einer Seite bzw. den korrekten Einsatz von HTML, CSS und JavaScript.
HTML, CSS und JavaScript reduzieren
Das Minifizieren von HTML-, CSS- und JavaScript-Dateien ist eine von vielen kleinen Stellschrauben, um die Ladegeschwindigkeit deiner WordPress Webseite zu optimieren. Im Beitrag HTML, CSS und JavaScript in WordPress reduzieren erklären wir dir, wie du durch schlanken Code Ladezeit einsparst.
Die Performance-Optimierung ist in den letzten Jahren ganz schön kompliziert geworden. Vor allem seit Google angekündigt hat, diese User-zentrierten Performance-Kriterien in die Rankingberechnung mit einfließen zu lassen. Die besten Tools zur Messung deiner WordPress Performance:
- PageSpeed Insights von Google
- GTmetrix
- Lighthouse ist direkt in die Entwickler-Tools von Google Chrome eingebaut.
- TREO Site Speed
TREO gefällt mir persönlich besonders, weil es schnell und übersichtlich ist. PageSpeed Insights und GTmetrix sind extrem detailliert.
Mit diesem Vorwissen und den Tools bist du bestens ausgestattet, um deine eigene Performance zu messen. Wenn du dies selbst machst, dann schlage ich folgende Vorgehensweise vor:
- Miss erst einmal den Ausgangszustand. Wie schnell ist deine Website vor der Optimierung?
- Aktiviere bzw. implementiere eine Optimierung.
- Anschließend kannst du erneut die Performance messen. Hat es nachweislich etwas gebracht? Falls nicht, dann entferne die Optimierung und versuche etwas anderes. Falls ja, dann behalte die Optimierung. Teste, ob noch alles funktioniert wie vorher und füge eine weitere Optimierung hinzu.
Viele versuchen bei PageSpeed Insights einen Wert von 100 zu erreichen. Daran ist erstmal nichts auszusetzen, außer dass es nicht notwendig ist, die volle Punktzahl zu erreichen. Andere Tools messen anders und was eine 100 bei PageSpeed Insights ist, das ist vielleicht nicht so gut bei GTmetrix. Außerdem ist es deutlich wichtiger, von einer 30 auf eine 90 zu kommen, als von einer 90 zu einer 100.
WordPress Performance verbessern
Schnelleres WordPress Hosting
DEN schnellsten Hoster in jeder Lage und zu jeder Zeit gibt es nicht. Dafür gibt es zu viele Faktoren, die sich auf die Auslieferungszeit und Verarbeitung der Anfragen auswirken. Folgende Faktoren machen die Beurteilung nicht gerade einfach:
- Tageszeit
- Auslastung des Servers
- Geolocation
- Die Geschwindigkeit der Verbindung der User.
Dennoch bietet jeder Hoster unterschiedliche Pakete, die eine deutliche Auswirkung auf die Performance einer WordPress Website haben können. Einsteigerpakete sind meist günstiger und naturgemäß nicht so schnell. Daher ist eine der ersten sinnvollen Optimierungen tatsächlich ein Upgrade des Pakets.
Bei Raidboxes gibt es zum Beispiel Starter-Pakete im Managed WordPress Hosting, die dir administrative Arbeiten mit WordPress abnehmen und bereits Optimierungen wie ein serverseitiges Caching enthalten. Aber auch besonders performante Pakete im High Traffic Hosting, etwa für Projekte mit sehr hohen Zugriffszahlen. Ebenso spezielle Tarife für das WooCommerce Hosting deines Onlineshops. Es versteht es sich von selbst, dass die größeren Pakete noch einmal einen zusätzlichen Performance-Boost bringen.
Welches WordPress Hosting für welches Projekt?
Du bist dir unsicher, wie viel Leistung bzw. welches Paket du für deine Website mit WordPress oder WooCommerce brauchst? Oder um wie viel die Geschwindigkeit deiner Website nach dem Umzug tatsächlich steigen kann? Unsere WordPress Expert:innen beraten dich gerne, auch zum Thema WordPress Performance.
Klar ist: Wer mehr zahlt, der erhält meist auch mehr Performance. Das gilt selbstverständlich für alle Hoster. Fast alle angewandten Performance-Tweaks werden durch Tarifupgrades potenziert. Aber was lässt sich herausholen, ohne direkt in einen höheren Tarif zu wechseln?
WordPress Caching nutzen
Abgesehen von den einfachsten Blogs verwendet fast jede WordPress Site eine Vielzahl weiterer Plugins. In der Regel verzögern Plugins bei jedem Seitenaufruf die Ladezeit um den Bruchteil einer Sekunde. Vor allem dann, wenn das Plugin Elemente in den HTML-Code einfügt, die dann zusätzlich geladen werden müssen oder aber weitere Datenbankabfragen durchführen.
Was wäre, wenn WordPress diese zusätzlichen „Aufgaben“ nur einmal pro Seite machen müsste und beim nächsten Aufruf einfach das Resultat dieser „zusätzlichen“ Operationen aus dem Zwischenspeicher abruft? So wird der nächste Ladevorgang deutlich beschleunigt, denn der Server muss nur noch eine fertige Datei ausliefern. Es finden im Idealfall keine weiteren Berechnungen statt, was den Ladezeitraum drastisch verkürzt. So kann zum Beispiel eine Seite, die ungecacht 5 Sekunden Ladezeit hat, innerhalb von Millisekunden ausgeliefert werden. Verbesserung der Geschwindigkeit zwischen 20 – 100 mal so schnell, sind bei eingeschaltetem Caching nichts unübliches.
Lösungen zum Caching sind bei der Beschleunigung von WordPress Websites unumgänglich. Idealerweise über eine serverbasierte Lösung, dazu gleich mehr. Ansonsten über eines der Caching Plugins, die in der Community sehr beliebt sind:
- WP Fastest Cache (kostenlos + kostenpflichtig)
- LiteSpeed Cache (kostenlos, funktioniert aber nur mit dem LiteSpeed Web Server)
- WP-Optimize (kostenlos + kostenpflichtig)
- WP Super Cache (kostenlos, vom WordPress-Hersteller)
- Hummingbird (kostenlos + kostenpflichtig)
- WP Rocket (kostenpflichtig, hier mein Tutorial auf YouTube)
- Cache Enabler (kostenlos)
- Borlabs Cache (kostenpflichtig)
- Hyper Cache (kostenlos)
- Comet Cache (kostenlos + kostenpflichtig)
Kostenpflichtige Plugins haben in der Regel mehr Features. Kostenlose Plugins helfen jedoch in den meisten Fällen, um 90 Prozent aller möglichen Zeitgewinne herauszukitzeln.
Caching Plugins sind allerdings wie eine Bandage. Sie verstecken Probleme, die besser von vornherein behoben werden sollten. Sie entfernen nicht unbedingt überflüssiges HTML, sie komprimieren keine zu groß geratene Bilddateien, ändern nicht unbedingt die Reihenfolge bei der Einbindung von JS- und CSS-Dateien etc. Selbst gecachte Seiten können somit immer noch langsam sein.
Wer hier von vorneherein sauber arbeitet, der braucht „eigentlich“ kein Caching-Plugin. Zumindest theoretisch. Denn Caching allgemein entlastet natürlich den Server und ist deswegen immer zu empfehlen. Es geht mir hier mehr um das Argument für eine gute Planung und sauberen, wohldurchdachten Code.
Hinzu kommt, dass Raidboxes auf ein besonders performantes, serverseitiges Caching setzt. Damit benötigst du kein zusätzliches Plugin und keine kostenpflichtige Lösung.
Flex Container statt Spalten und Zeilen im Page Builder
Page Builder oder auch Site Builder sind heute für viele Agenturen oder auch Entwickler:innen nicht mehr wegzudenken, schließlich erleichtern sie die Gestaltung von Seiten und Beiträgen in hohem Maße.
Vor- und Nachteile der Page Builder
Page Builder sind in der WordPress Szene umstritten. Während die einen die leichte Bedienbarkeit loben, kritisieren andere den ineffizienten Quellcode oder aufgeblähte Websites. Siehe unsere Beiträge Page Builder: Fluch oder Segen, Page Builder Features und 16 beliebte WordPress Page Builder im Vergleich.
Seit über 10 Jahren ist es in allen populären Page Buildern Standardprozedur, das Layout mit Spalten und Zeilen zu erstellen. Das führt oft zu einem verschachtelten DIV-Salat:
Das passiert vielfach auf jeder einzelnen Seite, was den Code meist unnötig aufbläht und auch negative Effekte auf den FCP haben kann. Durch geschickte Planung bei der Erstellung des Layouts lässt sich das meist vermeiden. Hersteller von Site Buildern gehen mittlerweile dazu über, die CSS-Standards Flexbox und Grid für die Layout-Erstellung zu berücksichtigen. Das sind gute Nachrichten, denn so reduziert sich der Codeumfang.
In der aktuellen Version des Page Builder Elementor zum Beispiel lässt sich in den Einstellungen der Flexbox Container aktivieren. Das gibt dir nicht nur mehr Flexibilität bei der Gestaltung, es reduziert auch den HTML-Code und macht die Ladezeiten schneller.
Ein Klick auf Direction -> Row richtet die Container in einer Reihe aus. Eine einfache Drei-Container-Struktur wird jetzt nicht gleich die Performance dramatisch verbessern. Wenn aber alle Sektionen, Reihen und Spalten mit diese neuen Technik umgesetzt werden, dann kann der Zugewinn bedeutend sein. Vor allem über viele Seiten hinweg und auch bei Optimierung von FCP und LCP.
Das Feature befindet sich bei Elementor noch im Alpha-Stadium. Andere Builder benutzen diese neue Vorgehensweise schon länger und alle Builder werden sie in Zukunft anbieten. Es lohnt sich also, die neue Arbeitsweise schnellstmöglich in den Workflow zu übernehmen.
Es kommt dabei weniger darauf an, CSS-Flexbox und/oder CSS-Grid zu verwenden, sondern auf eine Verschachtelung zu verzichten. Theoretisch lässt sich sogar ein tabellenbasiertes Layout aus den 2000ern durch „entschachteln“ optimieren.
Das richtige WordPress Theme
Es gibt Tausende von Themes für WordPress. Die sind sicher alle schon optimal auf Performance getrimmt, richtig? Falsch. Die meisten Themes konzentrieren sich darauf, hübsch auszusehen. Das macht aus Verkaufssicht auch Sinn. Themes werden hauptsächlich nach Attraktivität ausgewählt. Die wenigsten WordPress Themes legen wirklich Wert darauf, schlanken Code zur Priorität zu machen – oder was Page Builder betrifft: schlanken Code zu erzeugen.
Diese Themes und Builder sind aus meiner Sicht aktuell zu empfehlen:
Das sind echte Meta-Themes, sie erlauben also so gut wie alle denkbaren Layout-Optionen, sie haben eine enorme Auswahl an schicken Layouts und sind von Grund auf auf Performance optimiert. Die meisten dieser WordPress Themes lassen sich mit anderen Page Buildern wie Elementor kombinieren. Manche haben einen eigenen Page Builder.
Bilder und andere Elemente optimieren
Die weitaus meisten Websites verwenden Bilder. Größere Bilder sehen oft besser aus, verlängern aber auch die Ladezeiten. Kleiner ist besser, aber unabhängig davon gibt es eine Menge Tipps zu beachten:
- Empfehlenswert sind Höchstmaße von unter 2.000 Pixeln. Größere Bilder öffnen sich besser in einem neuen Fenster.
- Das richtige Format ist entscheidend. JPEG für fotografische Bilder mit vielen Farben und Schattierungen, PNGs und GIFs können für Bilder mit weniger Farben deutlich kleiner ausfallen. Am besten ausprobieren.
- Vektorgrafiken wie Logos und Illustrationen sehen als SVG super aus, sind unendlich skalierbar und auch klein. SVGs sind außerdem reine Textdateien mit Anweisungen, aus denen eine Grafik entsteht. Als Textdateien profitieren sie von der GZIP-Komprimierung, dazu gleich mehr.
- Das WebP Format von Google kann JPG-Dateien nochmals um ca. 25 bis 34 Prozent verkleinern.
- WebP gibt es schon seit 2010. Das neue Format AVIF reduziert WebP nochmals um ca. 30 Prozent und erreicht nicht selten 50 Prozent Ersparnis im Vergleich zu JPEG. AVIF hat aktuell noch nicht den vollen Support für alle Browser, allerdings wächst dieser von Monat zu Monat.
Es gibt Plugins, die schon beim Upload deine Bilder in alle Formate umwandeln und dann einfach die kleinste Datei einbinden. Hier die beliebtesten Plugins für WordPress:
- Smush
- Optimus
- EWWW Image Optimizer
- ShortPixel Image Optimizer
- TinyPNG
- Imsanity
- Imagify
- reSmush.it
- Kraken.io Image Optimizer
- WP Compress
- Autoptimize
- WP Offload Media
- Optimole
- Hammy
- Robin image optimizer
- WP Compress
- Imsanity
WP Compress hat eine sehr übersichtliche Oberfläche und erledigt Komprimieraufgaben im Hintergrund. Die Erweiterung ist nicht gerade günstig, dafür sehr komfortabel. Wenn du lieber mit einem kostenlosen Plugin anfangen möchtest, solltest du dir Imsanity genauer anschauen.
Die meisten Optimizer haben ein Premium-Modell, das entweder nach Bildgröße oder Anzahl der Bilder begrenzt. Ausnahme ist Robin. Sollte man für solch ein Plugin überhaupt bezahlen? Es kommt darauf an, wie viel Kontrolle du benötigst. Es ist alternativ möglich, die Bilder selbst mit Desktop-Tools zu optimieren, oder auf der Kommandozeile (optimizt, compress-images) bzw. online vor dem Hochladen (TinyPNG, Shortpixel).
Die meisten Plugins legen auch Bilder in unterschiedlichen, kleineren Maßen an. Je nach Auflösung des User-Browsers wird so direkt eine deutlich kleinere Datei eingebunden, was nochmals zu deutlichen Performancegewinnen führt.
Lazy Loading bewirkt, dass ein Bild erst dann geladen wird, wenn deine Besucher:innen an die Stelle scrollen, an der es auf der Seite erscheint. Die meisten Bildoptimierer unterstützen das. Wobei es hierzu auch kostenlose Plugins gibt, zum Beispiel Lazy Load von WP Rocket und Lazy Loader. Auch Videos können bzw. sollten erst bei „Erreichen“ geladen werden, siehe Lazy Load for Videos.
Fonts cachen
Neben Bildern lassen sich beliebige andere Assets lokal (auf dem Server) zwischenspeichern. Das verbessert nicht nur die Konformität mit internationalen Datenschutzgesetzen, es verbessert in der Regel auch die Performance. Vor allem dann, wenn die Fonts gecacht werden. Dann lädt der Browser sie einmal herunter und zeigt sie beim nächsten Mal direkt an, ohne sie erst laden zu müssen. Das funktioniert beispielsweise gut mit dem WordPress Plugin OMGF Host Google Fonts Locally.
Selektives Laden von Assets je Seite
Eine besonders effektive Methode, um mehr Geschwindigkeit herauszuholen, ist das selektive Laden von CSS- und JS-Dateien je nach Seite oder Beitrag. Hier gibt es gleich mehrere Möglichkeiten, die zum Ziel führen.
Ein Beispiel: Die WordPress Website verwendet einen Formular-Manager wie WPForms. Dieses Plugin lädt seine Formularfunktionen gleich auf jeder Seite. Benötigt wird diese Funktionalität jedoch nur auf der Kontaktseite. Freesoul Deactivate Plugins ist ein Plugin, das hier unterstützt:
Es ermöglicht über eine Matrix die Aktivierung oder Deaktivierung aller Plugins je Seite. Es ist zwar auch möglich, Performance Plugins wie perfmatters hierfür zu verwenden, welches ebenfalls die Auslieferung von CSS- und JS-Dateien unterbindet. Jedoch unterdrückt Freesoul das Laden des gesamten Plugins, es reduziert damit auch die Arbeit, die im Hintergrund auf dem Server gemacht werden muss.
Tweaks mit perfmatters
Lohnt sich der Kauf eines Plugins wie perfmatters? Thoeretisch lassen sich alle Optimierungen auch manuell oder mit anderen Plugins durchführen. Das wäre jedoch ein wahnsinnig hoher Arbeitsaufwand, vor allem dann, wenn es für mehrere WordPress Websites gemacht werden muss.
Alleine in den normalen Optionen hat ein Plugin wie perfmatters mehr als zwei Dutzend Optimierungen untergebracht. Sind die alle sinnvoll? Das kommt darauf an, wie gut sich die WordPress User mit den Features auskennen. Beispielsweise lässt sich der RSS-Feed abschalten, das spart ein paar Bytes. Es bedeutet aber auch, dass Besucher:innen der Website die Beiträge nicht mehr per RSS-Feed einfach abonnieren können. Das solltest du dir also gut überlegen.
Es ist erstaunlich, wie viel Spielerein WordPress standardmäßig aktivert hat (Emojis, Dashicons etc.), sie lassen sich erst einmal gefahrlos deaktiveren. Bei den Einstellungen bezogen auf die Datenbank solltest du eher Vorsicht walten lassen. So könnte es theoretisch einiges an Arbeitszeit vernichten, die Revisionen zu deaktiveren. Wenn ohnehin ein Cache verwendet wird, sind Datenbank-Optimierungen meist nicht sonderlich wichtig.
Im Gegensatz dazu ist der Einsatz von Google-Maps auf einer Seite in der Regel eine Katastrophe für die Performance. Diese Karten sollten wirklich nur geladen werden, falls dringend notwendig. Viele Themes binden eine Map zum Beispiel auf der Startseite ein, das muss ja nicht unbedingt sein. Bei WooCommerce Onlineshops kann der Aufruf von wc-ajax=get_refreshed_fragments starke Verzögerungen bewirken. Diese lassen sich mit „Disable card fragments“ abschalten.
Ohnehin lohnt sich ein Blick in die Dokumentation von perfmatters und in die von WP Rocket. Wer so richtig tief eintauchen möchte, der findet dort etliche Ansatzpunkte. Natürlich kann man auch einfach eines dieser Plugins kaufen und sich eine Menge Zeit sparen. Allerdings versteht man somit eher weniger, was im Hintergrund passiert.
Minifikation
Die Minifikation entfernt unnötige Zeichen, vor allem Leerzeichen und Tabulatoren aus HTML-, CSS- und JS-Dateien. Es ist mehr Best Practice, als dass es wirklich einen großen Performance-Schub bringt. Mit Autoptimize lässt sich Minifikation sehr leicht ein- oder ausschalten.
Gzip-Komprimierung und Brotli
Im Vergleich zur Minifikation schleift Komprimierung oft mehr als 50 Prozent der Dateigröße von Textdateien ab. Es lohnt sich auf jeden Fall, diese anzuschalten, etwa den Kompressions-Algorithmus Brotli. Meist ist eine solche Komprimierung auch schon beim Webhoster eingeschaltet. Falls nicht, gibt es zusätzlich Tools, welche die Dateien komprimiert im Dateisystem ablegen. Vor allem, weil die Komprimierung von Textdateien in der Regel deutlich effektiver ist.
Brotli ist ein von Google entwickeltes Komprimierungsformat, das noch effizienter ist als Gzip. Natürlich wird auch Brotli auch von Raidboxes unterstützt.
Signifikante Optimierungen für JavaScript und CSS
Gerade was die Optimierung für FCP und LCP angeht, gibt es heutzutage über diverse Plugins und sogar direkt in den Themes die Möglichkeit, drastische Performancegewinne zu erzielen. In meinen Tests sind dies sogar oft die besten Techniken, um eine Seite in den Bereich von 90 bis 100 zu bringen. Es handelt sich um das verzögerte Nachladen der CSS- und JS-Dateien.
Im kostenlosen Plugin Autoptimize gibt es die Einstellung „Aggregate JS-files“. Diese ist standardmäßig aktiviert. Um in den Genuss von echter Beschleunigung zu kommen, sind folgende Einstellungen notwendig:
Die „Defer-Option“ sorgt dafür, dass JavaScript erst später im Renderprozess nachgeladen wird. Zuerst werden HTML und Assets geladen, dann JS. In der Praxis stehen somit vor allem Interaktiv-Elemente nicht sofort in den ersten Sekunden zur Verfügung. Aber die Seite selbst wird blitzschnell angezeigt.
Da JavaScript programmtechnisch so gut wie alles nachladen kann, was es möchte, ist diese Technik mit Vorsicht zu genießen. Es kann hier eine Menge schiefgehen. Das ist auch der Grund, warum die Option nicht standardmäßig aktiviert ist. Der Performancegewinn kann gigantisch sein, aber nach der Aktivierung musst du jede Seite überprüfen, ob sie auch noch richtig funktioniert.
Ebenso nach jedem Update sowie beim Einsatz neuer Plugins, die eventuell eigene JavaScript-Dateien ins Spiel bringen. Diese Option zu aktivieren bietet sich demnach nur dann an, wenn man danach sowie regelmäßig etwas Zeit zur Überprüfung investieren kann.
Bei den CSS Dateien verhält es sich ähnlich. Hier muss „Eliminate render-blocking CSS“ aktiviert werden. Bei CSS Anweisungen gibt es das zusätzliche Problem, dass gewisse Seiten oder auch Bereiche auf der Website leicht anders aussehen sollen. Ein Teil der Seite sieht gleich aus (Farben, Fonts, Position des Headers), aber ein anderer Teil sieht unterschiedlich aus (Bild im Header, Zusätzliche Infos im Footer etc.).
Autoptimize verweist hier auf einen externen und kostenpflichtigen Dienst, der versucht, dieses Problem zu lösen. „Critical CSS“ ist dabei das CSS, das unbedingt ganz am Anfang geladen werden muss. Der Rest kann später nachgeladen werden.
Auch Plugins wie WP Rocket und perfmatters haben solch eine Funktion eingebaut. Wie gut diese funktioniert, kommt ganz darauf an, welche Plugins du gerne auf der eigenen WordPress Website verwenden möchtest. Es geht also nur mit einem Test. Aber wenn es funktioniert, dann ist der Boost wirklich groß.
Kostenlos an diese Funktion zu kommen, ist aktuell so gut wie ausgeschlossen, weil es ein hartes Problem ist. Denn jede Website ist anders. Selbst jede Unterseite auf einer Website ist anders und verändert sich auch durch Updates ständig. Die einzige Möglichkeit, hier 100 Prozent Performance rauszuholen, ist ein tiefes Verständnis dafür zu entwickeln, was tatsächlich beim Ladevorgang jeder Seite passiert. Nur wenn du bereit bist, diesen aufwändigen Weg zu beschreiten, kannst du für jede Seite tatsächlich eine 100 erreichen.
Fazit – WordPress schneller machen
Es gibt viele Stellschrauben bei der Optimierung der WordPress Performance. Ein schnelles WordPress Hosting ist wichtig und die Grundlage für alles. Aber nur schnelles Hosting garantiert keinesfalls Top-Geschwindigkeiten. Hierfür ist es notwendig:
- Die Assets auf der Website so klein wie möglich zu machen, also zu komprimieren.
- Das richtige Format auswählen (etwa WebP oder SVG). Nur so große Bilder zu laden, wie für den jeweiligen Zweck notwendig sind (Desktop vs. Tablet vs. Mobile).
- Caching zu aktiveren oder ein serverbasiertes Caching zu nutzen: Sobald eine Ressource einmal „zusammengebaut“ ist, kann sie aus den Zwischenspeicher geladen werden, bis sich etwas ändert. Auch externe Ressourcen wie Google Fonts sollten vom eigenen Server geladen werden.
- Die Reihenfolge beim Laden optimieren. Defering von CSS und JS mittels Plugin oder Dienst bzw. erst das Laden, was wirklich notwendig ist, dann den Rest (Stichwort: Critical CSS).
- Unnötigen Ballast abschmeißen: Braucht es wirklich Emojis bei jedem Ladevorgang?
Der wichtigste Tipp, den ich dir aus der Praxis geben kann: Caching und Defering sorgen in der Regel für 90 Prozent der Performance. Hier sollte also dein Fokus bei den eigenen Optimierungen liegen. Ich wünsche dir viel Erfolg und eine hohe Geschwindigkeit für deine Projekte mit WordPress und WooCommerce.
Deine Fragen zur WordPress Performance
Welche Fragen zum Thema WordPress schneller machen hast du? Nutze gerne die Kommentarfunktion. Du willst über neue Beiträge zu WordPress und WooCommerce informiert werden? Dann folge uns auf Twitter, Facebook, LinkedIn oder über unseren Newsletter.
Also im Punkto Performance kann man schon eine ganze Menge rausholen, das sehe ich immer wieder – aber man muss auch am Ball bleiben, sonst wird es nichts 🙂 Danke für Deine tollen Tipps und liebe Grüße, Mirco
Bezüglich Server:
Ich habe die Erfahrung gemacht, dass besonders bei größeren WordPress Seiten ein Umstieg von Apache auf NGINX einen deutlichen Performance Unterschied ausmacht.
Also die paar Euro mehr lohnen sich meiner Meinung nach!