Browser Caching

Browser-Caching erlaubt es dir, deine Website schneller zu machen, indem Dateien im Browser deiner Besucher_innen gespeichert werden. Auf diese Weise kannst du sowohl die Menge an Daten, die der Browser herunterladen muss, als auch die Anzahl von HTTP-Anfragen verringern.

Hinweis: Browser-Cache ist nur anwendbar auf Dateien, die von deiner eigenen Domain ausgeliefert werden. Auf externe Dateien, z.B. von Facebook, Google, usw. hat WP Rocket keinen Einfluss.

Wie Browser-Cache funktioniert

Eine gute Erklärung, wie Browser-Cache funktioniert, liefert Wikipedia (Stand vom 17.03.2016):

Browser-Cache ist ein Puffer-Speicher des Webbrowsers, in dem bereits abgerufene Ressourcen (z. B. Texte oder Bilder) auf dem Rechner des Benutzers (lokal) als Kopie aufbewahrt werden. Wird eine Ressource später erneut benötigt, ist sie aus dem Cache schneller abrufbar, als wenn sie erneut aus dem World Wide Web heruntergeladen werden müsste.

Jedes Mal, wenn für die Darstellung einer Seite die Inhalte zu einer URL benötigt werden, wird zuerst im Cache nachgesehen, ob diese bereits vorhanden sind.

Browser-Cache mit WP Rocket nutzen

Um Browser-Cache mit WP Rocket zu aktivieren, brauchst du das Plugin nur zu installieren und zu aktivieren. Das war’s schon! WP Rocket setzt automatisch die optimalen Verfallsdaten für die verschiedenen Dateitypen in deiner .htaccess-Datei.

# Expires headers (for better cache control)
<IfModule mod_expires.c>
ExpiresActive on
# Perhaps better to whitelist expires rules? Perhaps.
ExpiresDefault                          "access plus 1 month"
# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
ExpiresByType text/cache-manifest       "access plus 0 seconds"
# Your document html
ExpiresByType text/html                 "access plus 0 seconds"
# Data
ExpiresByType text/xml                  "access plus 0 seconds"
ExpiresByType application/xml           "access plus 0 seconds"
ExpiresByType application/json          "access plus 0 seconds"
# Feed
ExpiresByType application/rss+xml       "access plus 1 hour"
ExpiresByType application/atom+xml      "access plus 1 hour"
# Favicon (cannot be renamed)
ExpiresByType image/x-icon              "access plus 1 week"
# Media: images, video, audio
ExpiresByType image/gif                 "access plus 1 month"
ExpiresByType image/png                 "access plus 1 month"
ExpiresByType image/jpeg                "access plus 1 month"
ExpiresByType video/ogg                 "access plus 1 month"
ExpiresByType audio/ogg                 "access plus 1 month"
ExpiresByType video/mp4                 "access plus 1 month"
ExpiresByType video/webm                "access plus 1 month"
# HTC files  (css3pie)
ExpiresByType text/x-component          "access plus 1 month"
# Webfonts
ExpiresByType application/x-font-ttf    "access plus 1 month"
ExpiresByType font/opentype             "access plus 1 month"
ExpiresByType application/x-font-woff   "access plus 1 month"
ExpiresByType image/svg+xml             "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# CSS and JavaScript
ExpiresByType text/css                  "access plus 1 year"
ExpiresByType application/javascript    "access plus 1 year"
</IfModule>

Potenzielle Probleme

Auf Apache-Servern

Falls du auf einem Apache-Server Schwierigkeiten mit Browser-Cache hast, stelle sicher, dass das Modul mod_expires aktiv ist. Kontaktiere deswegen am besten deinen Webhosting-Provider. Eine Erklärung, wie mod_expires zu aktivieren ist, sofern du den erforderlichen Zugriff hast, findest du hier:
www.absolutelytech.com/2010/08/02/howto-enable-or-disable-modules-in-apache

In der Kommandozeile:

$ sudo a2enmod expires

… und anschließend Apache neu starten:

$ sudo /etc/init.d/apache2 restart

Auf Windows-Servern (IIS)

Auf einem Windows-Server (IIS) gibt es keine .htaccess-Datei, in der die Regeln für Browser-Cache definiert werden könnten. Hier findest du eine Anleitung, um die korrekten Regeln für deine config-Datei zu kreieren:
www.htaccesstowebconfig.com

Auf NGINX-Servern

Auf NGINX kannst du dies anwenden:

location ~* \.(css|js|ico|gif|jpe?g|png|svg|eot|otf|woff|woff2|ttf|ogg)$ {
	expires max; 
}

… und anschließend NGINX neu starten:

$ service nginx restart