So beschleunigen Sie WordPress

Dieser Leitfaden enthält 9 Tipps, die Ihnen zeigen, wie Sie nahezu jede WordPress-Website auf eine maximale Ladezeit von 1-2 Sekunden bringen können. Es wird regelmäßig aktualisiert und im ersten Quartal 2020 um ein paar zusätzliche Bonustipps erweitert.

Wenn Sie einen Hosting-Partner und Ressourcen (Design, Plugins usw.) ausgewählt haben, die von Grund auf auf Geschwindigkeit ausgelegt sind und erwarten, dass sie mit großen Verkehrsmengen gut funktionieren (viele sind dies nicht), dann können Sie erreichen Ladezeiten pro Seite in Sekundenbruchteilen, sollte Ihre im Cache gespeicherte Website problemlos Spitzen von mehr als 500 gleichzeitigen Besuchern bewältigen , und 20.000 oder mehr täglich Seitenaufrufe sollten kein Problem sein. Dieser Leitfaden hilft Ihnen auch dabei, bei synthetischen Benchmarks wie GTMetrix und Google Page Speed ​​Bestnoten zu erzielen.

Hier ist ein Überblick darüber, worauf wir gleich eingehen werden:

IN DIESEM ARTIKEL

Nehmen Sie den einfachen Weg ...

Indem Sie einfach Ihre WordPress-Website mit Websavers hosten und ein Caching-Plugin wie WP Super Cache oder WP Rocket + Bildoptimierungs-Plugins wie Imagify oder ShortPixel aktivieren, wird jeder einzelne Schritt dieser Anleitung entweder für Sie erledigt oder automatisiert. Ordentlich, oder?

HÖR ZU

Lesen Sie weiter, um loszulegen!

Dieser Leitfaden wird nicht :

• Hilfe bei der Behebung von Problemen mit Ihrem Hosting-Provider oder dessen schlechter Leistung. Die Verwendung eines hochwertigen WordPress-Hosts macht einen großen Unterschied.
• Ihnen bei Problemen mit Plugins oder Themen helfen, die Dinge stark verlangsamen oder zu schlechten synthetischen Benchmark-Ergebnissen beitragen könnten. Zum Beispiel führen viele Plugins und Themes externe Ressourcenaufrufe durch, die Sie nicht kontrollieren können, was die Geschwindigkeit (und Benchmark-Ergebnisse) Ihrer Website von Natur aus verringert. In ähnlicher Weise verwenden viele Plugins und Themen schlechte Codierungspraktiken, die unnötigerweise eine umfangreiche Datenverarbeitung erfordern. Daher müssen Sie möglicherweise Teile Ihrer Website (Design, Plugins usw.) deaktivieren, damit sie gut mit Ihrem Caching-Plugin zusammenspielen. Wenn Sie leistungsoptimierte Designs und Plugins verwenden, werden Sie feststellen, dass das Aktivieren des Cachings ohne viel Fummelei perfekt funktioniert.
• Geben Sie Ihren Kuchen und essen Sie ihn auch:Möglicherweise müssen Sie zugunsten einer besseren Leistung und Bestnoten bei synthetischen Benchmarks wie Google PageSpeed ​​Insights einen Verlust an Funktionalität oder Qualität hinnehmen . Wenn Sie Bilder in außergewöhnlich hoher Qualität lieben, die jeweils über 1 MB groß sind, oder nicht ausreichend komprimierte Videodateien, dann werden Sie niemals Bestnoten bei Website-Benchmarking-Dienstprogrammen erhalten. Wenn Sie einen Teil Ihrer Website haben, der bei jedem Seitenladen dynamische Inhalte lädt, müssen Sie diese Funktion möglicherweise deaktivieren oder eine andere Möglichkeit finden, sie für eine optimale Leistung zu laden.

Wenn Sie ein Problem haben, bei dem eine Seite länger als 10 Sekunden braucht, bevor sie überhaupt mit dem Laden von Inhalten beginnt, liegt oft ein zugrunde liegendes Problem mit WordPress oder der Hosting-Konfiguration vor, das Sie lösen müssen, bevor Sie sich an das Caching wenden, um eine Lösung zu finden. Klicken Sie hier, um Hilfe bei der Behebung von Problemen mit plötzlich sehr langsam ladenden Seiten zu erhalten.

Wenn Sie mit allen Anweisungen in diesem Artikel vertraut sind, sollten Sie sie alle ausführen, um die Leistung Ihrer Website zu verbessern. Wenn Sie ein einfacher Benutzer sind, ist es auch in Ordnung, nur die Abschnitte zu vervollständigen, mit denen Sie sich wohl fühlen. Sie werden immer noch eine Leistungsverbesserung sehen, nur nicht so viel wie wenn Sie alle Optionen abschließen können.

Einige Teile bieten massive Ladezeitverbesserungen, während andere vernachlässigbar sind. Einige Teile werden dazu führen, dass ein synthetischer Geschwindigkeitstest wie Googles PageSpeed- oder GTMetrix-Geschwindigkeitstest Ihre Website hoch einschätzt, aber möglicherweise keinen Unterschied in den Ladezeiten der realen Welt bewirkt. Das ist die Natur synthetischer Benchmarking-Tools.

Ohne weiteres Gerede, hier sind 9 Dinge, die Sie tun können, um die Leistung Ihrer Website drastisch zu verbessern:

1. Verwenden Sie einen Webhost, der sich um die Leistung kümmert

Wenn Ihr Webhosting-Anbieter seine Server mit Tausenden von Websites herunterlädt oder nicht weiß, wie er das Beste aus seinen Servern herausholen kann, kommt es unvermeidlich zu häufigen Verlangsamungen.

Wenn Sie Shared Hosting verwenden, stellen Sie sicher, dass Ihr Host die Gesamtzahl der Sites pro Server künstlich begrenzt, um sicherzustellen, dass Ihre Site über die Ressourcen verfügt, die sie für eine gute Leistung benötigt. Wenn Sie einen eigenen VPS haben, fragen Sie Ihren Hoster, wie er konfiguriert ist und welche Teile der Konfiguration entwickelt wurden, um eine Top-Leistung zu gewährleisten. Wenn ihre Antwort Dinge wie SSD-Speicher, Nginx oder Lightspeed-Webserver und benutzerdefinierte optimierte Konfigurationen zum Bereitstellen statischer Cache-Dateien nicht enthält, ist es an der Zeit, einen besseren WordPress-Webhost zu finden.

Wenn Sie sehr sind Wenn Sie sich Sorgen um die Leistung machen, wird empfohlen, einen eigenen VPS zu erwerben, um sicherzustellen, dass Ihre Site über dedizierte Ressourcen verfügt. Wir empfehlen oft, zuerst unser unterlastetes Shared Hosting auszuprobieren, und wenn Sie feststellen, dass Sie noch mehr Leistung benötigen, können Sie jederzeit zu einem VPS aufsteigen.

2. Verwenden Sie die neueste PHP-Version

Hier können Sie sich einige Kennzahlen ansehen. Wenn Sie PHP 8.x oder 7.4 verwenden können, bietet es eine zusätzliche Leistungssteigerung von 30–70 % gegenüber 7.2 und früher. Aber beachten Sie:Sie werden diese Verbesserung auf gecachten Front-End-Seiten nicht bemerken. Diese Leistungsverbesserung wird in den Seitenladezeiten sichtbar, wenn Ihr Caching-Plugin die Seite zum ersten Mal zwischenspeichert und wenn Sie den WordPress-Adminbereich durchlaufen.

Das klingt großartig … aber wie verwende ich es?

• Melden Sie sich zuerst bei Plesk an
• Gehen Sie unter der betreffenden Domain zu "PHP-Einstellungen"
• Oben auf der Seite befinden sich zwei Dropdown-Menüs; eine für die PHP-Version, eine für den PHP-Handler. Probieren Sie für die Version die neueste Version aus. Wenn Sie dann auf Probleme stoßen, steigen Sie wiederholt eine Version herunter, bis die Website funktioniert. Wenn Sie tun Wenn Probleme mit der neuesten Version von PHP auftreten, ist es letztendlich am besten, die Ursache des Problems zu finden und zu beheben, z. B. ein inkompatibles Plugin oder Design zu aktualisieren. Wir wissen jedoch, dass dies nicht immer möglich ist.
• Scrollen Sie nach unten und klicken Sie auf „OK“ oder „Übernehmen“

3. Brotli- oder Gzip-Komprimierung aktivieren

Verwenden Sie das Shared Hosting von Websavers oder einen VPS mit praktischem Support? Wenn ja, haben wir die Brotli-Komprimierung (mit gzip-Fallback) bereits für Sie aktiviert! Erlebst du den Websavers-Unterschied noch nicht? Nun, wir sehen uns hoffentlich bald.

Wenn Sie nicht bei uns hosten, erledigen dies die meisten Caching-Plug-ins für Sie. Wenn dies jedoch nicht der Fall ist, fügen Sie diese Werte zu Ihrer .htaccess-Datei hinzu, um die GZIP-Komprimierung auf Ihrer Website anzuzeigen:

<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml
</IfModule>

Dies weist Apache an, alle kompatiblen Inhalte vor dem Senden zu komprimieren – das spart Zeit und Bandbreite!

Verwenden Sie nur Nginx? Verwenden Sie dies in Ihren Nginx-Anweisungen, um Brotli mit gzip-Fallback zu aktivieren:

brotli on;
brotli_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;

gzip on;
gzip_disable "MSIE [1-6]\\.(?!.*SV1)";
gzip_proxied any;
gzip_comp_level 5;
gzip_types text/plain text/css application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript image/x-icon image/bmp image/svg+xml;
gzip_vary on;

4. Langes Ablaufdatum für Browser-Cache aktivieren

Zunächst ist es wichtig zu verstehen, was genau Browser-Caching ist. Hat Ihnen jemals jemand gesagt, dass Sie Ihren Cache in Ihrem Browser löschen sollen? Das liegt daran, dass moderne Browser so konfiguriert sind, dass sie Kopien von Ressourcen (HTML/CSS/JS/Bilder) herunterladen, um die Seitengeschwindigkeit bei späteren Besuchen zu beschleunigen. Standardmäßig sind einige dieser Gegenstände jedoch so eingestellt, dass sie sehr schnell „ablaufen“ – was der Geschwindigkeit nicht viel zugute kommt!

In einem späteren Abschnitt werden wir über die Verwendung eines Caching-Plugins für WordPress sprechen. Wenn Sie ausschließlich einen Apache-Webserver verwenden, werden alle Caching-Plugins auch lange Ablaufwerte für das Browser-Caching für Sie aktivieren .

Dies wird nicht empfohlen, wenn Sie Ihre Website noch entwickeln. Bitte wenden Sie diese Konfiguration nur an, wenn die Website live ist.

Wenn Ihre Website jedoch live ist und Sie etwas mehr Leistung herausholen möchten, können Sie Ihren Server so konfigurieren, dass er Besuchern mitteilt, wie lange sie bestimmte Ressourcen behalten sollen.

Diese Anweisungen werden vom Server gesendet, um den Browser jedes Besuchers anzuweisen, wie lange er verschiedene Dateitypen „aufbewahren“ soll.

Apache-Webserver verwenden?

Fügen Sie Ihrer .htaccess-Datei Folgendes hinzu.

## EXPIRES CACHING ## 
<IfModule mod_expires.c> 
ExpiresActive On 
ExpiresByType image/jpg "access plus 1 year" 
ExpiresByType image/jpeg "access plus 1 year" 
ExpiresByType image/gif "access plus 1 year" 
ExpiresByType image/png "access plus 1 year" 
ExpiresByType text/css "access plus 1 month" 
ExpiresByType text/html "access plus 1 week" 
ExpiresByType application/x-compressed "access plus 1 week" ExpiresByType application/x-gzip "access plus 1 week" 
ExpiresByType application/pdf "access plus 1 month" 
ExpiresByType text/x-javascript "access plus 1 month" 
ExpiresByType application/x-javascript "access plus 1 month" ExpiresByType application/x-shockwave-flash "access plus 1 month" ExpiresByType image/x-icon "access plus 1 year" 
ExpiresDefault "access plus 1 week" 
</IfModule> 
## EXPIRES CACHING END ##

Nginx mit Plesk verwenden

• Melden Sie sich bei Plesk an und gehen Sie unter der Domain, die Sie optimieren, zu „Apache- und nginx-Einstellungen“
• Unter Läuft ab> Benutzerdefinierten Wert eingeben geben Sie 365 Tage ein . und aktivieren Sie das Kontrollkästchen:Antwort mit Expires-Headern nur für statische Dateien
• Aktivieren Sie die Kästchen neben Intelligente Verarbeitung statischer Dateien und Statische Dateien direkt von nginx bereitstellen

Falls bei der Option „Statische Dateien direkt von nginx bereitstellen“ nicht alle diese statischen Dateierweiterungen aufgelistet sind (entweder mit Leerzeichen oder | dazwischen), fügen Sie dies in das bereitgestellte Feld ein:

ac3|atom|avi|bmp|bz2|css|csv|cue|dat|doc|docx|dts|eot|exe|flv|gif|gz|htm|html|ico|img|iso|jpeg|jpg|js|map|mid|midi|mkv|mp3|mp4|mpeg|mpg|m4a|ogg|ogv|otf|pdf|png|ppt|pptx|qt|rar|rm|rss|rtf|svg|svgz|swf|tar|tgz|ttf|txt|wav|webp|woff|woff2|xls|xlsx|zip

Klicken Sie jetzt auf Anwenden oder OK, um Ihre Änderungen zu speichern.

Verwendung von Barebones nginx

Fügen Sie dies zu Ihrer Nginx-Konfiguration hinzu:

location ~* \.(css|js)$ {
        gzip_vary on;
        expires 30d;
}
location ~* \.(ac3|atom|avi|bmp|bz2|css|csv|cue|dat|doc|docx|dts|eot|exe|flv|gif|gz|htm|html|ico|img|iso|jpeg|jpg|js|map|mid|midi|mkv|mp3|mp4|mpeg|mpg|m4a|ogg|ogv|otf|pdf|png|ppt|pptx|qt|rar|rm|rss|rtf|svg|svgz|swf|tar|tgz|ttf|txt|wav|webp|woff|woff2|xls|xlsx|zip)$ {      
        gzip_vary on;
        expires max;  
        log_not_found off;
}

5. Verwenden Sie einen serverseitigen statischen Cache-Generator

In unseren Tests ist die beste kommerzielle Option dafür WP Rocket und die beste kostenlose Option dafür ist WP Super Cache. Beide erstellen statische Cache-Dateien für alle Seiten und Beiträge Ihrer Website und beide funktionieren hervorragend mit unserer benutzerdefinierten nginx-Konfiguration, die die statischen Dateien automatisch erkennt und diese bedient, ohne dass ein schwererer Apache- und/oder PHP-Prozess gestartet werden muss. Die Vorteile, die wir bei der Bezahlung von WP Rocket gegenüber kostenlosen Caching-Plugins gefunden haben, liegen fast ausschließlich in der Verkleinerung und Optimierung des Website-Codes. Weitere Informationen dazu finden Sie in Teil 6 dieses Leitfadens weiter unten.

Wir verwenden eine intern erstellte benutzerdefinierte nginx-Konfiguration auf allen unseren Servern, um die Verwendung der gängigsten serverseitigen Seiten-Caching-Plug-ins automatisch zu erkennen und ihre statischen HTML-Dateien automatisch direkt mit nginx bereitzustellen, ohne dass sie zu Apache oder dem weiterleiten müssen PHP-Prozessor, wodurch die CPU- und Speicherauslastung reduziert wird. Unsere Systeme können statische Cache-Ausgaben von WP Rocket, WP Super Cache, WP Fastest Cache, W3 Total Cache und WP Optimize automatisch erkennen und bereitstellen. Leider kann Hummingbird nicht mit unseren Systemen arbeiten, da sie zufällig generierte statische Cache-Dateinamen verwenden. Wenn Sie Hummingbird verwenden möchten, bitten Sie den WPMUDEV-Support, ihre Cache-Dateinamen zu korrigieren.

Diese Plugins zur Generierung statischen Caches können es Ihrer Website ermöglichen, massive Traffic-Spitzen zu bewältigen, ohne selbst bei unseren Shared-Hosting-Diensten ins Schwitzen zu geraten!

Wir haben diese Konfigurationen verwendet, um eine Website auf Shared Hosting problemlos auf etwa 100.000 eindeutige Seitenaufrufe pro Tag und eine Website auf einem eigenen VPS auf über 500.000 eindeutige Seitenaufrufe pro Tag bei einer durchschnittlichen Last von 1,0 zu bringen.

Wenn Ihr Host nicht mithalten kann, sehen Sie sich unsere kanadischen WordPress-Hosting-Optionen an. Besser noch, mit den in diesem Schritt, Schritt 6 (Optimierung) und Schritt 7 (Bildkomprimierung) beschriebenen Optimierungen kann Ihre Website je nach Thema von einem mangelhaften oder anderweitig niedrigen Google Page Speed-Score auf über 90 steigen und verwendete Plugins.

So erhalten Sie statische Cache-Ausgaben von unseren beiden bevorzugten Caching-Plug-ins:

• WP Rocket :So installieren und aktivieren Sie WP Rocket mithilfe ihrer Anleitung. Nach der Aktivierung beginnt es automatisch mit der Erstellung eines statischen Caches.
• WP-Super-Cache :Melden Sie sich bei Ihrer WordPress-Installation an und gehen Sie zu Plugins> Neu hinzufügen. Installieren Sie WP Super Cache und aktivieren Sie es. Gehen Sie zu Einstellungen> WP Super Cache und wählen Sie „Caching einschalten“ und drücken Sie die Schaltfläche Status aktualisieren. Klicken Sie auf die Registerkarte Erweitert. Kreuzen Sie alles mit „Empfohlen“ daneben an. Drücken Sie die Schaltfläche Status aktualisieren. Scrollen Sie nach unten zum Abschnitt „Ablaufzeit &Garbage Collection“ und stellen Sie das Intervall entweder auf einmal oder zweimal täglich ein und klicken Sie dann auf die Schaltfläche „Ablauf ändern“.

Einige Leute bevorzugen W3 Total Cache und andere wie WP Fastest Cache, unter vielen andere Caching-Plugins. Im Allgemeinen sind diese Plugins großartig darin, Leistungsverbesserungen zu handhaben, und jedes der oben aufgeführten Plugins eignet sich hervorragend zum Generieren statischer Cache-Dateien für eine schnellere Website-Performance. Sie neigen nicht alle dazu, so konstant gut in der Optimierung zu sein, wie in Schritt 6 unten beschrieben.

Öffnen Sie jetzt einen anderen Browser als den, mit dem Sie bei WordPress angemeldet sind, und laden Sie eine beliebige Seite auf Ihrer Website. Sobald der Ladevorgang abgeschlossen ist, aktualisieren Sie die Seite. Sie sollten feststellen, dass die Aktualisierung jetzt deutlich schneller ist als das anfängliche Laden der Seite. Dies liegt nicht *nur* daran, dass Ihr Browser das Laden der ersten Seite zum Cachen von Ressourcen verwendet hat, sondern auch (am wichtigsten) daran, dass der Server das Laden der ersten Seite verwendet hat, um eine statische Cache-Datei zu erstellen, die dann bei späteren Besuchen bereitgestellt wird.

Das Aktivieren des statischen Seiten-Cachings sollte keine Auswirkungen auf die Funktionalität Ihrer Website haben, verbessert jedoch die TTFB (Zeit bis zum ersten Byte) Ihrer Website erheblich, da der Server jede Seite viel schneller als zuvor bereitstellen kann. Die einzige Ausnahme hiervon ist, wenn Sie dynamische Daten haben, die sich auf der Website ändern, die kein AJAX verwendet; Dieser Teil Ihrer Website wird nicht automatisch bei jedem Seitenaufruf aktualisiert. Sprechen Sie in diesem Fall mit Ihrem Website-Entwickler und bitten Sie ihn, die Funktion so zu ändern, dass AJAX verwendet wird.

In Teil 6 unten können Sie lesen, wie Sie entweder WP Rocket oder SuperCache + Autoptimize konfigurieren, um aggressivere On-Site-Optimierungen zu handhaben, die Ihren Google Page Speed ​​Score dramatisch verbessern werden.

6. Verwenden Sie ein Code-Minifier- und -Optimierungs-Plug-in

Im Allgemeinen möchten Sie sich jeweils an ein einzelnes Optimierungs-Plugin halten, aber WP Super Cache und Autoptimize sind tatsächlich so konzipiert, dass sie zusammenarbeiten. WP Rocket hat die Funktionalität von WP Super Cache und Autoptimize kombiniert, indem es sowohl statische Cache-Dateien generiert (wie in Teil 5 oben beschrieben) als auch den Site-Code minimiert und optimiert.

Autoptimize funktioniert mit WP Rocket, da WP Rocket seine Optimierungsfunktion einfach deaktiviert, wenn Autoptimze erkannt wird, aber in den meisten Fällen haben wir es als unnötig empfunden, da WP Rocket die gleiche Funktionalität bereits eingebaut hat. Die Optimierungsfunktion von WP Rocket tendiert auch dazu besser darin sein, Websites nicht zu beschädigen, als Autoptimize, wenn Funktionen wie Minimierung und Zurückstellung von Skripten aktiviert sind.

Wenn es um die Optimierung des Site-Codes (wie Minifizierung) geht, der oft erforderlich ist, um mit Google Page Speed ​​oder GTMetrix höhere Punktzahlen zu erzielen, konnten wir W3 Total Cache oder WP Fastest Cache (unter anderem) nie zum Laufen bringen B. Autoptimize oder die Optimierungsfunktionen von WP Rocket.

Bitte beachte:Dies ist die Phase, in der das Aktivieren einiger Optimierungen Teile deiner Website beschädigen kann, insbesondere wenn das Design, das Plugin oder der benutzerdefinierte Code nicht so geschrieben wurde, dass er gut mit der Optimierung funktioniert. Wenn dies bei Ihnen auftritt, lesen Sie bitte die Schritte zur Fehlerbehebung unten, um zu erfahren, wie Sie es beheben können.

WP Rocket (unser Favorit, kostenpflichtig)

Wenn Sie Teil 5 oben nicht abgeschlossen haben, installieren und aktivieren Sie WP Rocket mithilfe der Anleitung. Gehen Sie dann zu Einstellungen> WP Rocket, um loszulegen.

Cache-Tab:

• Caching für Mobilgeräte aktivieren . Wenn Sie eine komplett separate mobile Website verwenden (nicht empfohlen) oder wenn Sie viel verwenden von Elementen, die nur auf Mobilgeräten angezeigt werden (z. B. das Austauschen von Teilen einer Seite zwischen einer Mobilversion und einer Desktopversion), und aktivieren Sie dann das Kontrollkästchen Cache-Dateien für Mobilgeräte trennen .
• Caching für eingeloggte WordPress-Benutzer aktivieren

Änderungen speichern

Registerkarte "Dateioptimierung":

• CSS minimieren: aktiviert
• CSS-Dateien kombinieren: deaktiviert*
• CSS-Bereitstellung optimieren: Wir empfehlen die Verwendung der Option „CSS asynchron laden“, da sie viel zuverlässiger ist als das (derzeit in der Beta-Phase befindliche) Entfernen von nicht verwendetem CSS. Remove Unused CSS gibt einen dramatischen Leistungsschub, ist aber nicht zuverlässig für den regelmäßigen Gebrauch oder für schwache Nerven. Wenn Sie es verwenden, seien Sie auf eine Reihe manueller Anpassungen vorbereitet, um es genau richtig zu machen.
• JavaScript-Dateien verkleinern: aktiviert
• JavaScript-Dateien kombinieren:deaktiviert*
• JavaScript verzögert laden: aktiviert
• JavaScript-Ausführung verzögern: aktiviert**

Löschen Sie jetzt den WP Rocket-Cache und laden Sie Ihre Website in einem anderen Browser

* getrennte Dateien ist besser, wenn Ihr Webserver http/2 oder http/3 (wie unserer) unterstützt, da die Webserver-Engine die Dateien gleichzeitig sendet.

** Überprüfen Sie die Konsolenregisterkarte Ihres Browsers Web Inspector auf Fehler. Wenn Sie Fehler sehen, die wie folgt aussehen:„jQuery ist nicht definiert“ oder „jQuery wurde nicht gefunden“, müssen Sie entweder herausfinden, warum ein Plugin, Design oder benutzerdefinierter Code seine Ressourcen nicht ordnungsgemäß lädt, und die erforderlichen ausschließen aus der Funktion „Javascript verzögern und/oder verzögern“ oder nehmen Sie den einfachen Weg und wenden Sie die Standardausschlüsse für Ausführung von Javascript verzögern an auf dieser Seite der WP Rocket-Einstellungen angezeigt.

Wenn Sie andere JavaScript-Fehler sehen, müssen Sie entweder Load JavaScript Deferred deaktivieren oder feststellen, warum die JavaScript-Datei nicht verzögert werden kann, indem Sie sich an den Entwickler des Plugins oder Designs wenden.

Medien-Tab:

• Alles auf dieser Seite aktivieren.

Add-Ons-Registerkarte:

• Wenn Sie Google Analytics auf Ihrer Website aktiviert haben (aber nicht über Google Tag Manager ) aktivieren Sie das Google-Tracking-Addon. [Hinweis:Das MonsterInsights-Plugin ist mit diesem Addon nicht kompatibel. Wenn Sie dieses Rocket-Addon verwenden möchten, müssen Sie MonsterInsights entfernen und den Analysecode mit einem anderen Plugin wie Googles SiteKit einfügen oder den UA-Code manuell kopieren und in das Header-Code-Feld Ihres Designs einfügen.]
• Wenn Sie den Facebook-Pixel-Tracking-Code auf Ihrer Website verwenden, aktivieren Sie das Facebook-Pixel-Add-on.
• Wenn Ihr Server den Varnish-Cache verwendet (unserer nicht, da stattdessen nginx-Caching verfügbar ist), sollten Sie das Varnish-Add-on hier aktivieren.
• Wenn Sie Shortpixel oder Imagify verwenden, um WEBP-Bilder für Ihre Website zu generieren, können Sie die Option hier aktivieren, um sie gegenüber JPG-/PNG-Bildern zu bevorzugen.

WP Super Cache + Autoptimize (kostenlos)

Wenn Sie Teil 5 oben noch nicht abgeschlossen haben, tun Sie dies jetzt, melden Sie sich dann bei Ihrer WordPress-Installation an und gehen Sie zu Plugins> Neu hinzufügen und installieren und aktivieren Sie Autoptimize

Automatische Optimierung konfigurieren

• Gehen Sie zu Einstellungen> Automatische Optimierung und vergewissern Sie sich, dass Javascript, CSS und HTML-Minifizierung aktiviert sind.
• Probieren Sie auf der Registerkarte „Extras“ neben „Google Fonts“ die Option „Schriftarten asynchron mit webfont.js kombinieren und laden“ sowie „Abfragezeichenfolgen entfernen“ aus.
• Drücken Sie auf „Änderungen speichern“.

Fehlerbehebung bei defekten Elementen

Nachdem Sie Optimierungen in WP Rocket oder Autoptimze aktiviert haben, sehen Sie möglicherweise defekte Elemente auf der Website, abhängig von den verwendeten Plugins, Ihrem Thema und einer Vielzahl anderer Dinge. Hier sind einige häufige Gründe und Lösungen:

Bilder oder Videos fehlen:

Wenn Ihr Design oder Seitenersteller Javascript verwendet, um Bilder auf Ihre Website zu laden, wird der Lazyload für Bilder und Videos Option kann dies unterbrechen und Sie müssen Lazyload auf den Seiten mit diesem Inhalt deaktivieren. Sehen Sie sich den Abschnitt „Pro Seite“ weiter unten an, um zu erfahren, wie das geht.

Globale Teile meiner Website funktionieren nicht, wie ein Menü

Wenn es sich um benutzerdefinierten Code handelt, versuchen Sie am besten, den verantwortlichen Code zu reparieren. Wenn es sich um eine Funktionalität handelt, die von einem Design oder Plugin bereitgestellt wird, versuchen Sie, diese Funktionalität durch ein anderes Design oder Plugin zu ersetzen (da das Design oder Plugin wahrscheinlich nicht auf Geschwindigkeit ausgelegt ist). Sie können das Kompatibilitätsproblem auch dem Entwickler des Designs oder Plugins melden, damit er es beheben kann.

Wenn Sie den Code nicht reparieren oder die Software ersetzen können, die nicht auf Geschwindigkeit optimiert ist, deaktivieren Sie alle Arten der Minimierung (z. B.:auf der Registerkarte Dateioptimierung in WP Rocket) eins nach dem anderen, bis Sie sehen, dass das Problem verschwindet, dann aktivieren Sie alles wieder außer der Einstellung, die Sie zuletzt deaktiviert haben, da sie das Problem verursacht hat.

Wenn Sie ein fortgeschrittener Benutzer sind, können Sie die Einstellung, die bei Ihnen nicht funktioniert hat, erneut aktivieren und dann mit einem Webinspektor die Seite untersuchen und herausfinden, welche Datei das Problem verursacht. Sobald Sie es gefunden haben, gehen Sie in die WP Rocket- oder Autoptimize-Konfiguration und schließen Sie nur diese einzelne Datei von der Minifizierung aus. (Dies wird wahrscheinlich Ihren Page Speed ​​Score verringern)

Ausschlüsse pro Seite

Wenn Sie feststellen, dass nur ausgewählte Seiten Probleme haben, können Sie die Option deaktivieren, die nur auf dieser Seite Probleme verursacht. Bearbeiten Sie die Seite in WordPress und suchen Sie rechts nach dem Feld „Cache-Optionen“.

Wenn Sie wissen, welcher Teil des Caching-Plugins Probleme verursacht, deaktivieren Sie ihn. Wenn Sie dies nicht tun, deaktivieren Sie sie nacheinander und sehen Sie sich die Seite an, um zu sehen, ob das Problem behoben ist. Wiederholen Sie dies für jede Option, bis Sie die Problemeinstellung gefunden haben.

Wenn Sie Remove Unused CSS (WP Rocket) verwenden

Je nach Situation gibt es zwei Möglichkeiten, dies zu beheben:

1. Haben Sie gerade mit Remove Unused CSS begonnen? Nun, wir haben Ihnen gesagt, dass dies wahrscheinlich passieren würde. Aber egal; Suchen Sie einfach nach den CSS-Bezeichnern aller Elemente, die „schief gegangen“ sind, und fügen Sie sie der Ausschlussliste in WP Rocket hinzu. Laden Sie dann die Seite in einem anderen Browser neu und bestätigen Sie, dass das Problem behoben ist. Wenn nicht, suchen Sie das nächste CSS-Element und probieren Sie es aus – Sie werden es herausfinden und sollten dennoch deutliche Leistungssteigerungen Ihrer Website feststellen.
2. Wenn Sie Remove Unused CSS jetzt eine Weile laufen lassen und es plötzlich bei Ihnen kaputt geht, versuchen Sie, es zu aktualisieren, indem Sie zu WP Rocket -> Clear Used CSS gehen. Dies kann im Falle einiger Plugin- / Theme-Updates passieren, und WP Rocket muss aufgefordert werden, seine Dateien neu zu generieren.

7. Bilddateien komprimieren

Dies wird Ihnen nur einen kleinen spürbaren Geschwindigkeitsschub geben, es sei denn, Sie verwenden eine langsame Internetverbindung oder haben extrem große Bilder auf Ihre Website hochgeladen, aber es kann Ihre Google-Seitengeschwindigkeitsbewertung erheblich verbessern, da ihre mobilen Core Web Vitals-Bewertungen basieren auf 3G-Internetgeschwindigkeiten.

Bitte beachten Sie:Wenn Sie Ihre Website ernsthaft optimieren möchten, um den letzten Leistungsabfall herauszuholen, müssen Sie mit einem Rückgang der Bildqualität rechnen . Wenn Sie Bilder in höherer Qualität bevorzugen, wählen Sie diese Option auf Kosten von a) Seitenladezeiten bei langsameren Verbindungen und b) synthetischen Benchmark-Ergebnissen wie Google PageSpeed ​​und Core Web Vitals. Sie müssen wählen, was Sie bevorzugen:qualitativ hochwertige Bilder oder bessere Benchmark-Ergebnisse. Sie können nicht beides haben.

Original manuelle Methode: Führen Sie alle PNG-Dateien durch einen Kompressor und laden Sie sie dann über ihre vorherigen Versionen hoch. Möglicherweise stehen Ihnen diese Tools nicht zur Verfügung, aber ich habe alle PNG-Dateien in Photoshop geöffnet und für das Web exportiert. Wenn Sie dies tun, stellen Sie sicher, dass die Dateien nicht Fügen Sie Metadaten hinzu, da dies große Teile der Dateien auffressen kann – insbesondere bei Symbolen.

Einfachere, kostenpflichtige Methode: Wir verwenden Imagify, um dies für uns zu erledigen, alles serverseitig. Es ist ein fantastisches Plugin, das von denselben Leuten wie WP Rocket bereitgestellt wird, das die Komprimierung Ihrer Bilder automatisch verwaltet, entweder als One-Shot-Deal oder fortlaufend. Eine weitere Option ist das Plugin namens ShortPixel, es funktioniert in unseren Tests genauso gut wie Imagify und bietet auch sehr faire Preise. Sehen Sie sich alle an unserer empfohlenen Ressourcen hier.

Caching von Gravataren

Da sich dies auf Bilder bezieht (die von Postautoren verwendet werden), schien dies der richtige Ort zu sein, um darüber zu sprechen. WP Rocket und WP Super Cache speichern Gravatare standardmäßig nicht im Cache, d. h. wenn Sie viele Kommentare zu Ihren Posts von verschiedenen Autoren haben, kann das Laden externer Gravatar-Bilder die Gesamtrenderzeit Ihrer Seite verlängern.

Der WP Rocket-Blog hat einen großartigen Artikel darüber, wie man das handhabt, wobei das Wesentliche darin besteht, das Plugin namens „FV Gravatar Cache“ zu installieren.

8. Konfigurieren Sie Nginx zum Laden der statischen Cache-Ausgabe [Erweitert]

Nur diejenigen, die einen Host mit einem Nginx-Reverse-Proxy verwenden, können diese Option nutzen. Dies gilt für alle, die Plesk 12 oder neuer verwenden, es sei denn, der Host macht seltsame Dinge mit seiner Serverkonfiguration.

Da nginx eine leichtere Webserver-Engine als Apache ist, verbessern wir die Leistung erheblich, indem wir nginx so konfigurieren, dass diese statischen Dateien direkt bereitgestellt werden. Anstatt für jede einzelne Anfrage einen nginx-Thread zu verwenden, um einen Apache-Prozess zur Bearbeitung der Anfrage zu starten, konfigurieren wir nginx so, dass nur der nginx-Thread verwendet wird und sich nicht die Mühe macht, Apache für alle Seiten zu laden Wir haben eine statische Cache-Datei . Cool oder?

Wenn Ihr Hosting bei Websavers erfolgt, müssen Sie nichts davon tun, da wir dies automatisch mit allen Shared-Hosting- und verwalteten VPS-Hosting-Konten tun.

Wenn Ihr Hosting nicht bei uns ist, dann müssen Sie Administratorzugriff auf Plesk haben um diese Änderungen anwenden zu können. In der Regel haben Sie nur Administratorzugriff, wenn Sie über einen eigenen VPS oder dedizierten Server verfügen.

Konfiguriere nginx, um die statischen Cache-Dateien von WP Super Cache zu laden

Erinnern Sie sich noch, als wir WP Super Cache gesagt haben, dass es mod_rewrite verwenden soll, um unsere Cache-Dateien bereitzustellen? Dies geschieht so ziemlich automatisch, wenn Sie Apache verwenden, da WP Super Cache Ihre .htaccess-Datei automatisch so ändert, dass sie die erforderlichen mod_rewrite-Regeln enthält.

Wenn Sie Folgendes in Ihre nginx-Konfiguration einfügen, wird nginx angewiesen, Apache vollständig zu umgehen, wenn die statische Ausgabe von WP Super Cache bereitgestellt wird. In Plesk tun Sie dies unter den „Apache- und nginx-Einstellungen“ der Domain und dann im Feld „Zusätzliche nginx-Anweisungen“.

### WP Super Cache Below ###
set $cache_uri $request_uri;
 
# POST requests and urls with a query string should always go to PHP
if ($request_method = POST) {
    set $cache_uri 'null cache';
}   
if ($query_string != "") {
    set $cache_uri 'null cache';
}   
 
# Don't cache uris containing the following segments
if ($request_uri ~* "(/wp-admin/|/xmlrpc.php|/wp-(app|cron|login|register|mail).php|wp-.*.php|/feed/|index.php|wp-comments-popup.php|wp-links-opml.php|wp-locations.php|sitemap(_index)?.xml|[a-z0-9_-]+-sitemap([0-9]+)?.xml)") {
    set $cache_uri 'null cache';
}   
 
# Don't use the cache for logged in users or recent commenters
if ($http_cookie ~* "comment_author|wordpress_[a-f0-9]+|wp-postpass|wordpress_logged_in") {
     set $cache_uri 'null cache';
}
 
# Use cached or actual file if they exists, otherwise pass request to WordPress
location ~ / {
   try_files /wp-content/cache/supercache/$http_host/$cache_uri/index.html $uri /index.php;
}

Es ist wichtig zu beachten, dass Sie möglicherweise einige Probleme mit den bereitgestellten nginx-Regeln haben, wenn Sie WordPress in einem Unterverzeichnis verwenden, insbesondere wenn Sie eine „verschachtelte“ Installation haben (mit WordPress im Basisverzeichnis und einer anderen WordPress-Installation in einem Unterverzeichnis). Dies kann mit vielen kniffligen Änderungen an den bereitgestellten Regeln erreicht werden, aber es ist definitiv in jeder Hinsicht einfacher, wenn Sie Ihre Struktur so ändern, dass sie eine Subdomain anstelle eines Unterordners verwendet.

Konfiguriere nginx, um die statischen Cache-Dateien von WP Rocket zu laden

Wir haben diese praktische nginx-Konfiguration von WP Rocket genutzt, indem wir eine Konfiguration generiert haben (folgen Sie den Installationsanweisungen) und das Ergebnis dann in den Speicherort der erweiterten nginx-Konfigurationsanweisungen in Plesk eingefügt haben.

Wir haben Anpassungen an der Konfiguration vorgenommen, die unserer Meinung nach für unsere Umgebung am besten funktioniert hat. Wenn Sie unsere Optimierungen nutzen möchten, schauen Sie sich Hosting mit Websavers an!

9. Nicht verwendete PHP-Module deaktivieren [Erweitert]

Plesk Administratorzugriff erforderlich (nur VPS)

Wenn Sie vollen Administratorzugriff auf Ihren VPS haben, können Sie tatsächlich PHP-Module deaktivieren, die Sie nicht benötigen. Weniger Dinge, die in den Speicher geladen werden müssen, weniger Speicherverbrauch, weniger intensive Verarbeitung und schnellere Leistung. Dies ist jedoch sehr fortgeschrittenes Zeug, also stellen Sie sicher, dass Sie entweder wissen, was Sie tun oder mache es nicht auf einem Live-Server, also machst du nichts kaputt 😉

• Gehen Sie zu Tools und Einstellungen in Plesk
• Unter Allgemeine Einstellungen Klicken Sie auf PHP-Einstellungen
• Wählen Sie die PHP-Version und den Handler aus, für die Sie die Einstellungen ändern möchten
• Schalten Sie PHP-Module aus, die Sie nicht verwenden
• Klicken Sie auf OK oder Bewerben zu speichern

Gehen Sie jetzt zurück zu Ihrer Website und stellen Sie sicher, dass nichts kaputt ist! Möglicherweise wissen Sie nicht, welche Module in jedem Aspekt Ihrer Website verwendet werden, daher kann einiges an Versuch und Irrtum erforderlich sein, um dies richtig zu machen.

Bonus-Tipp Nr. 1:ReCAPTCHA v3

Wenn Sie Google ReCAPTCHA zum Bot-Schutz verwenden, entweder in einem Kontakt-/Angebotsformular oder zum Schutz Ihrer Blog-Post-Kommentare, machen wir Ihnen keine Vorwürfe, es ist ein anständiges System, um zu verhindern, dass Bots Ihre Formulare senden.

ReCAPTCHA v2 ist die Art von Captcha, die jeder kennt und irgendwie hasst, wenn Sie ein Kästchen ankreuzen, um zu bestätigen, dass Sie kein Bot sind. Der Hass kommt ins Spiel, wenn das System eine Bestätigung anzeigt, bei der Sie auf Bilder klicken müssen, die einer Beschreibung wie „Wählen Sie alle Bilder mit einem Lastwagen darin“ entsprechen. Kommt Ihnen das bekannt vor?

ReCAPTCHA v3 ist „unsichtbar“, da kein Kontrollkästchen erforderlich ist, was für eine verbesserte Benutzererfahrung sorgt. Aber es hat einige Nachteile bei der Website-Geschwindigkeit, da es alle seine Skripte auf jeder Seite Ihrer Website laden muss . Es verfolgt Benutzer, während sie auf Ihrer Website navigieren, da anhand ihres Verhaltens festgestellt werden kann, ob es sich um Bots handelt oder nicht.

Da diese Skripte auf jeder Seite geladen werden, können Sie verhindern, dass diese Ressourcen von GTMetrix und anderen synthetischen Benchmarking-Tools gekennzeichnet werden, indem Sie zurück zu v2 wechseln (sofern Ihr Formular- oder Recaptcha-Plugin dies zulässt), da die Ressourcen dann nur noch vorhanden sind auf den Seiten geladen, auf denen die Formulare vorhanden sind.

Advanced users:you can write a WordPress hook that dequeues the ReCAPTCHA v3 resources on all pages except those with your forms, but you should know that doing this will very likely decrease the effectiveness of ReCAPTCHA’s protection.

Bonus Tip #2:Detect and Reduce Dynamic Processing

There’s a few common cases where, regardless of all the caching and optimizations, we just implemented, your server will still launch dynamic PHP processes to serve the requests, thus requiring CPU and memory to handle that request.

Check out our guide to analyzing dynamic processing with WordPress!

UPDATE HISTORY:

• Jan 12, 2022:Updates to PHP Versions, simplify wording, add brotli compression details
• Aug 28, 2020:Add notes about content encoding headers, MonsterInsights incompatibility with WP Rocket’s GA Addon, Gravity Forms incompatibility with deferred jQuery
• Apr 30, 2020:Add Bonus Tip 2:Detecting and Reducing Dynamic Processing
• Apr 26, 2020:Add tip for caching Gravatar images.
• Jan 10, 2020:Add improved instructions for configuring browser caching rules in Plesk to improve scores on synthetic benchmarks like Google Page Speed and GTMetrix.
• Dec 31, 2019:Remove our recommendation to use nginx direct to PHP-FPM processing and instead use rules that will ensure nginx will directly serve your caching plugin’s static cache file output, bypassing apache. This results in identical performance for most website visitors, but much better security, if your host has Plesk’s web application firewall properly configured.
• Oct 15, 2019:Split step 5 into 2 sections (now 5 and 6) — static cache generating in step 5 (which improves performance but doesn’t break websites) and optimization of resources in step 6 (which improves scores on things like Google Page Speed, but which can also break your website).
• Feb 4, 2019:Replace Better WordPress Minification with Autoptimize as recommended minification system.
• Jan 9, 2019:Add PHP 7.3 Info
• Dec 3, 2018:Reformatted post for better understanding of difference between browser cache vs. nginx->php-fpm direct mode. Use Plesk recommended rewrite rules for nginx.
• Jul 4, 2017:Added ShortPixel as an image compression option, reformatted post.
• Feb 20, 2016:Added commercial option, WP Rocket, as a great paid replacement for WP Super Cache + WP Minify.
• Jun 16, 2017:Added some hosting/server tips.
• Dec 25, 2013:Original Post Date.