So beheben Sie das Leverage Browser Caching in WordPress im Jahr 2021

So beheben Sie das Leverage Browser Caching in WordPress

Einführung

Lädt Ihre Website langsam? Suchen Sie nach einer effektiven Lösung, um die Browser-Caching-Warnung in WordPress zu beheben ? Die Seitengeschwindigkeit ist ein wesentlicher Aspekt der Benutzererfahrung. In diesem Beitrag werde ich grundlegende bis fortgeschrittene Punkte darüber teilen, wie man Leverage Browser Caching in WordPress repariert. Wenn Sie also auch mit diesem Problem konfrontiert sind, müssen Sie den vollständigen Beitrag zum besseren Verständnis lesen.

Die Zeit, die benötigt wird, um die angeforderte Seite im Browser des Benutzers zu laden, hat großen Einfluss darauf, dass der Benutzer selbst auf Ihrer Seite bleibt, um beispielsweise einen Verkauf abzuschließen. Die Ladezeit einer Seite hängt von mehreren Faktoren ab: Der Browser-Cache ist einer davon.

Wir werden zunächst untersuchen, was das Leverage Browser Caching ist und wie es dazu beitragen kann, Ihre Website zu beschleunigen. Wir werden also sehen, wie man auswertet, ob eine WordPress-Site Browser-Caching benötigt. Schließlich werden wir uns verschiedene Möglichkeiten ansehen, um die Browser-Caching-Warnung in WordPress mit und ohne Verwendung eines Plugins zu lösen.

Was ist die Hebelwirkung des Browser-Cachings?

Der Cache ist temporärer Speicherplatz. Wenn ein Besucher eine Seite Ihrer Website anfordert, sammelt der Server die erforderlichen Informationen aus der Datenbank, organisiert sie in einem HTML-Dokument und stellt sie dem Browser bereit. Der Browser analysiert dieses Dokument und lädt alle relevanten Ressourcen herunter, um die Seite anzuzeigen.

Das Caching ist der Speichervorgang eines Teils der Nutzdaten der Seite in einem Cache, um das Laden von Seiten in Zukunft zu beschleunigen. Der Cache kann auf dem Server oder Gerät des Besuchers vorhanden sein.

Im Server-Cache können Sie die Datenbankabfragen und die statische HTML-Antwort für die angeforderte Seite speichern.

Das Leverage Browser Caching ist der temporäre Speichernutzungsprozess auf dem Gerät des Besuchers, um Ressourcen wie Stylesheets, Skripte und Bilder für einen bestimmten Zeitraum zu speichern.

Nachfolgende Besuche einer Seite führen dazu, dass der Browser jedes Mal, wenn der Benutzer die Seite anfordert, dieselben Ressourcen wiederholt herunterlädt. Da diese statischen Ressourcen eine erhebliche Menge an Nutzlast für eine WordPress-Site ausmachen, verkürzt das Browser-Caching die Seitenladezeiten.

Ist Browser-Caching erforderlich?

Eine Website-Überprüfung der Verteilung der Größe der Ressourcen Ihrer Payload zeigt im Allgemeinen, wie groß Ihre Ressourcen sind und wie viele Anfragen ein Browser senden muss, um sie herunterzuladen, bevor Ihre Seite angezeigt wird. Wenn Sie feststellen, dass ein erheblicher Teil Ihrer Webseite aus statischen Dateien besteht, sollten Sie in Betracht ziehen, Ihren Browser zwischenzuspeichern, um die Geschwindigkeit der Seite zu verbessern.

Ein natürlicherer Weg, um festzustellen, ob Browser-Caching erforderlich ist, ist die Verwendung eines Tools zum Testen der Seitengeschwindigkeit wie GTmetrix. Geben Sie einfach die URL Ihrer Website ein, um einen ausführlichen Test zu starten. Die Testergebnisse zeigen Ihnen, wie Sie Ihre Website beschleunigen können. Wie Sie sehen können, ist eine häufige Warnung im Ergebnisabschnitt die Nutzung des Browser-Cachings.

Alternativ können Sie Think with Google verwenden, ein Tool zum Testen der Seitengeschwindigkeit, um Ihre Website auf Mobilgeräten zu bewerten. Eine wichtige Empfehlung dieses Tools ist es, Browser-Caching für Ihre Website zu nutzen.

PageSpeed ​​​​Insights, ein weiteres Google-Tool zum Testen der Geschwindigkeit Ihrer Website-Seite, schlägt möglicherweise vor, dass Sie eine effektive Cache-Richtlinie erstellen, um die Seitengeschwindigkeit zu verbessern. Browser-Caching ist ein wichtiger Bestandteil einer effektiven Cache-Richtlinie.

Beheben Sie die Leverage-Browser-Caching-Warnung in WordPress ohne Plugins

Wenn Sie kein Plugin verwenden möchten, können Sie die Webservereinstellungen ändern, um die Hebelwirkung des Browser-Caching zu beheben. In diesem Fall weist der Webserver den Browser des Besuchers an, bestimmte Ressourcen im Browser-Cache zu speichern. Der Browser speichert diese Dateien für einen bestimmten Zeitraum lokal und verwendet sie bei späteren Besuchen der Seite.

Die Einrichtung des Webservers, um die Browser der Besucher anzuweisen, mit dem Caching zu beginnen, ist von Server zu Server unterschiedlich. In diesem Beitrag zeigen wir Ihnen, wie Sie das Browser-Caching auf den beiden beliebtesten Webservern aktivieren: Apache und Nginx.

Sie können das Leverage-Browser-Caching korrigieren, indem Sie die folgenden Schritte ausführen:

1. Hinzufügen von Expires-Headern: Diese Header teilen dem Browser mit, wann er eine neue Version einer Ressource vom Server anfordern soll.
2. Cache-Check-Header ändern: Sie können diese Header verwenden, um die Cache-Kriterien festzulegen.
3. Das Setzen von Entity-Tags-Headern (ETags): Es ist möglich festzustellen, ob sich eine Ressource auf dem Server im Vergleich zur lokalen Datei geändert hat.

Korrigieren Sie das Leverage-Browser-Caching in Apache

1. Erstellen oder bearbeiten Sie die .htaccess-Datei

Auf einem Apache-Server können Sie alle notwendigen Parameter in der .htaccess-Datei einstellen. Mit dieser Datei können Sie die Apache-Einstellungen manuell konfigurieren. Es ist eine einfache Textdatei, die Apache-Parameter speichert und Berechtigungen und Konfigurationen für das Verzeichnis festlegt, in dem sie sich befindet.

Lesen Sie mehr: On-Page-SEO-Checkliste: 10 umsetzbare Optimierungstipps für einen besseren Rang

Wenn Sie eine .htaccess -Datei im führenden Verzeichnis Ihrer Website ablegen, werden ihre Regeln auf alle Seiten Ihrer Website angewendet. Sie können auch eine andere .htaccess -Datei in einem Ihrer Unterverzeichnisse ablegen, um bestimmte Berechtigungen nur für diesen Speicherort festzulegen. Beachten Sie, dass untergeordnete .htaccess - Dateien die Einstellungen von .htaccess-Dateien in Stammverzeichnissen überschreiben .

Wenn Sie Terminalzugriff auf den Server haben, können Sie sich remote anmelden, um eine .htaccess -Datei am entsprechenden Speicherort zu erstellen (für Browser-Caching-Regeln auf Site-Ebene sollte dies der Stammordner sein).

Wenn Sie den cPanel-Dateimanager verwenden, wechseln Sie alternativ zum erforderlichen Speicherort und erstellen Sie eine .htaccess -Datei.

Wenn Sie bereits eine .htaccess -Datei haben, können Sie die neuen Browser-Caching-Regeln einfach hinzufügen.

2. Fügen Sie Expires-Header hinzu

Die erste Einstellung in der .htaccess -Datei besteht darin, die Expires-Header-Funktion zu aktivieren. Fügen Sie der Datei die folgende Zeile hinzu:

ExpiresActive On

Danach können Sie den Zeitraum für verschiedene Textdateien mit der unten gezeigten Syntax festlegen:

ExpiresByType Text / CSS „Zugriff 1 Monat“

ExpiresByType Text / HTML „Zugriff 1 Monat“

Um eine Ablaufzeit für Bilder festzulegen, verwenden Sie stattdessen Bild anstelle von Textschrägstrich und Bilderweiterung.

ExpiresByType Bild / JPEG „Zugriff 1 Monat“

ExpiresByType Bild / SVG „Zugriff 1 Monat“

Um die Bewerbungsfrist festzulegen, verwenden Sie Bewerbung und geben Sie die Dateiendung an.

ExpiresByType Antrag / pdf „Zugriff 1 Monat“

Verwenden Sie für alle anderen Dateien, die keiner bestimmten Einstellung unterliegen, die Definition ExpiresDefault:

ExpiresDefault „Zugriff 1 Monat.“

3. Definieren Sie eine Cache-Richtlinie

Als Nächstes müssen Sie die Cache-Kriterien mithilfe der Cache-Check-Einstellungen definieren.

Es gibt drei Hauptteile einer Cache-Richtlinie:

• wie eine Ressource zwischengespeichert wird
• der Ort des Cachings
• die Zeit, bevor die Ressource abläuft

Ein öffentlicher Cache zeigt dem Browser an, dass Ressourcen überall zwischengespeichert werden können. Im Gegensatz dazu ermöglicht ein privater Cache die Speicherung nur auf dem Clientgerät.

Beispielsweise sollte die Profilseite eines angemeldeten Benutzers nur auf dem Clientgerät zwischengespeichert werden.

Umgekehrt kann auch die Homepage eines Blogs auf einem CDN zwischengespeichert werden. Sie können eine öffentliche Cache-Richtlinie einrichten, indem Sie die folgende Regel hinzufügen:

<IfModul mod_headers.c>

Öffentliches Cache-Control-Header-Set

</ WennModul>

Sie können auch unterschiedliche Kriterien für verschiedene Dateitypen angeben, indem Sie dem Header-Modul die folgenden Filter hinzufügen:

<ifModul mod_headers.c>

<filesMatch „\. (ico | jpeg | jpg | png) $”>

Öffentliches Cache-Control-Header-Set

</ FilesMatch>

<filesMatch „\. (php) $”>

Privates Cache-Control-Header-Set

</ FilesMatch>

</ WennModul>

Der obige Code gibt an, dass der Browser Bilddateien überall speichern kann, PHP-Dateien müssen jedoch auf dem Clientgerät gespeichert werden.

Sie können jeder Dateiübereinstimmungsregel auch eine Expires-Konfiguration hinzufügen. Die Ablaufzeit muss in Sekunden definiert werden. Indem Sie es auf Null setzen, muss der Browser die Datei jedes Mal anfordern, wenn die Seite geladen wird:

Header-Set läuft ab 0

4. Deaktivieren Sie Entity-Tags in Apache

Schließlich ist es notwendig, die Entity-Tags mit dem folgenden Code zu deaktivieren:

FileETag Keine

Das Deaktivieren von ETag erfordert, dass sich der Browser auf Cache-Kriterien verlässt und die erneute Validierung von Dateien bei jedem Laden einer Seite vermeidet.

Speichern Sie die .htaccess -Datei und starten Sie Apache neu, damit die Änderungen wirksam werden.

Lösen Sie das Leverage Browser Caching in Nginx

In Nginx finden Sie die Konfigurationsdatei nginx.conf im Verzeichnis /etc/nginx/site-enabled/default.

Mit dem folgenden Code können Sie bestimmten Dateitypen einen Expires-Header hinzufügen:

Ort ~ * \. (ico | jpeg | jpg | png) $ {

läuft am 30. Tag ab;

}

Sie können demselben Codeblock auch einen Cache-Control-Header hinzufügen:

Ort ~ * \. (ico | jpeg | jpg | png) $ {

läuft am 30. Tag ab;

add_header Cache-Control „öffentlich“;

}

Speichern Sie die Konfigurationsdatei und starten Sie Nginx neu, damit die Änderungen wirksam werden.

Lösen Sie den Leverage Browser Cache mit einem Plugin

Wenn Sie ein Caching-Plugin für WordPress verwenden, unterstützt es möglicherweise bereits das Browser-Caching.

Sehen wir uns nun an, wie Sie das Leverage-Browser-Caching mit einigen der bekanntesten Cache-Plugins lösen können.

1. WP-Rakete

WP Rocket ist eines der schnellsten und am meisten empfohlenen Plugins für WordPress, das alle Geschwindigkeitsoptimierungen mit nur wenigen Klicks verwalten kann. Mit WP Rocket können Sie nicht nur das Browser-Caching lösen, sondern auch Ihre Website mit verschiedenen Techniken optimieren, wie z.

• statische Dateikomprimierung (GZip) – um die Gesamtdatengröße zu reduzieren (lesen Sie den vollständigen Beitrag zur Aktivierung der GZip-Komprimierung in WordPress)
• Datei-Cache aktivieren (einschließlich Cache-Preloading) – um den Server weniger zu belasten (und eine vorgescannte Kopie jeder Seite wiederherzustellen)
• Google Font Optimization – um sicherzustellen, dass massivere Schriftarten schnell geladen werden,
• Lazy Loading – damit Bilder nur dann berechnet werden, wenn der Benutzer zu dem Abschnitt einer Seite herunterscrollt, wo das Bild benötigt wird
• Minimierung und Kombination – Reduzierung der Größe und Kombination von Textressourcen, um sie dem Endbenutzer schneller bereitzustellen
• Verschieben Sie das Laden von JS – damit die Seite schnell angezeigt wird, anstatt darauf zu warten, dass alle Ressourcen heruntergeladen werden.
• Integrieren und aktivieren Sie ein CDN-Netzwerk – damit schwerere Images schneller bereitgestellt werden
• DNS -Prefetching – um die Zeit zu verkürzen, die benötigt wird, um den Ursprung von Inhalten Dritter aufzulösen

All dies mag für jeden unverständlich erscheinen, der nicht direkt mit der Optimierung einer Website befasst ist. In Wirklichkeit sind dies jedoch alles Maßnahmen, die Sie ergreifen müssen, wenn Sie WordPress beschleunigen möchten.

Wir empfehlen dringend, unseren WP Rocket-Test zu lesen.

2. LiteSpeed ​​​​Cache

LiteSpeed ​​​​Cache ist ein Caching-Plugin, mit dem Sie die Hebelwirkung des Browser-Caching lösen können, indem Sie lediglich die Funktion aktivieren. Installieren und aktivieren Sie das Plugin und gehen Sie zu den Cache-Einstellungen. Wechseln Sie zur Registerkarte Browser und lassen Sie die Cache- Option des Browsers zu.

Es ist auch möglich, die Ablaufzeit einzustellen. Beachten Sie jedoch, dass diese Einstellung für alle zwischengespeicherten Dateien auf der Website gilt.

3. WP Schnellster Cache

WP Fastest Cache ist ein weiteres WordPress-Cache-Plugin mit einfachen Anpassungsoptionen. Die kostenlose Version ermöglicht es Ihnen, das Browser-Caching zu aktivieren. Gehen Sie zur Einstellungsseite und aktivieren Sie das Kontrollkästchen für das Browser-Caching.

4. W3-Gesamtcache

W3 Total Cache ist ein weiteres weit verbreitetes Browser-Cache-Plugin. Sie können eine Vielzahl von Caching-Optionen anpassen. Gehen Sie nach der Installation zum Abschnitt Cache-Browser auf der Einstellungsseite.

Mit diesem Plugin können Sie Berechtigungen für eine Reihe von Dateikategorien festlegen, z. B. Bilder, Skripte und Stylesheets. Für jede Gruppe können Sie Expires-Header, Expires-Lebensdauern und ETags festlegen.

Häufig gestellte Fragen

Fazit

In diesem Beitrag haben wir die Bedeutung der Seitengeschwindigkeit untersucht und warum Sie das Leverage-Browser-Caching in WordPress beheben sollten. Wir haben Geschwindigkeitstest-Tools gesehen, die anzeigen, ob Ihre WordPress-Site Browser-Caching benötigt. Als Nächstes haben wir besprochen, wie die verschiedenen Webserver konfiguriert werden, um das Browser-Caching ohne die Verwendung eines Plugins zu ermöglichen. Schließlich haben wir uns drei beliebte Plugins angesehen, mit denen Sie die Hebelwirkung des Browser-Cachings in WordPress beheben können.