Home / WebServer / Apache / HowTo: Browser Caching im Apache Webserver aktivieren + htaccess mit mod_expires oder mod_headers
apache logo

HowTo: Browser Caching im Apache Webserver aktivieren + htaccess mit mod_expires oder mod_headers

Browser Caching ist eine einfache Methode um den Traffic einer Webseite zu reduzieren und somit die Performance zu erhöhen. Zudem dauert die Einrichtung im Apache Webserver maximal fünf Minuten und sollte bei allen gängigen Webhosting Paketen unterstützt werden.

Performance Test via Google Page Speed Insights

Auf Google Pages Speed Insights, kann man seine Website auf Geschwindigkeit (Performance) überprüfen lassen und erhält zudem eine detailierte Auswertung und sehr ernst gemeinte Verbesserungsvorschläge. Eine Überprüfung von www.sysadminslife.com sieht zB. (ohne aktiviertem Browser Cache) wie folgt aus:

Google PageSpeed Insights ohne aktiviertem Caching

Google sagt: „Browser-Caching nutzen“ – Leverage Browser Caching

„Die Aktualität der folgenden Cache-fähigen Ressourcen ist nur von kurzer Dauer. Legen Sie fest, dass folgende Ressourcen künftig mindestens einmal pro Woche ablaufen“

Jeder moderne Webbrowser (Chrome, Firefox, Internet Explorer, etc) hat einen eingebauten Cache, was bedeutet: dass Dateien zwischengespeichert und nicht bei jedem Aufruf neu heruntergeladen werden müssen. Darunter fallen in der Regel Dateitypen wie Bilder, Stylesheets, Javascripts, etc.. Der Browsercache funktioniert allerdings nur dann vernünftig, wenn auch am Webserver entsprechende Regeln bzw. ein Ablaufdatum für die einzelnen Dateitypen festgelegt wird.

Ist eine entsprechende „expire“ Regel aktiviert, so wird dem Browser vom Webserver mitgeteilt, dass zB. das Bild background.jpg für 7 Tage gecached werden kann. Der Browser muss das Bild somit nicht bei jedem Seitenaufruf neu laden, sondern behält es in seinem Zwischenspeicher. Das spart somit Traffic und dadurch auch Ladezeit.

Browser Caching aktivieren – htaccess mit mod_expires

Damit man das Browser Caching nun auf dem eigenen Root Server aktivieren kann, wird zuvor das Modul „mod_expires“ aktiviert, falls es noch nicht aktiviert ist. Ein managed Webhosting Paket sollte das Modul eigentlich zur Verfügung stellen. Unter den gängigsten Linux Distributionen wird mod_expires folgendermaßen auf der Commandline aktiviert. Ein Neustart des Apache Prozess ist anschließend erforderlich:

a2enmod expires
/etc/init.d/apache2 restart

Anschließend wird in die bestehende .htaccess Datei (falls vorhanden) oder in eine neue .htaccess Datei folgender Inhalt eingefügt. Der Teil kann auch direkt in die globale Apache Konfiguration oder in die Vhost Konfiguration geschrieben werden. Die If Anweisung schützt dabei den Apache Prozess, sodass angeführte „Expire Regeln“ nur zum Einsatz kommen, wenn auch das Modul mod_expires aktiviert ist:

<IfModule mod_expires.c>
  ExpiresActive On
  ExpiresByType image/gif "access plus 7 days"
  ExpiresByType image/ico "access plus 7 days"
  ExpiresByType image/jpeg "access plus 7 days"
  ExpiresByType image/jpg "access plus 7 days"
  ExpiresByType image/png "access plus 7 days"
  ExpiresByType text/css "access plus 7 days"
  ExpiresByType text/javascript "access plus 7 days"
  ExpiresByType application/x-javascript "access plus 7 days"
  ExpiresByType application/javascript "access plus 7 days"
</IfModule>

„ExpiresByType“ spricht den MIME Type an und setzt via „access plus 7 days“ den Cache Wert auf 7 Tage. Die entsprechenden Dateien bleiben also bis zu 7 Tage im Browser Cache erhalten. Hier kann natürlich auch ein höherer oder für gewisse MIME Types (css, xml, js, ..) auch ein niedrigerer Wert eingestellt werden. Je nach Anwendungsgebiet kann hier variiert werden. Mit 7 Tage haben wir allerdings gute Erfahrungen gemacht.

Alternative: Browser Caching mit mod_headers

Als Alternative zur Methode mit dem Modul mod_expires gibt es noch eine Variante mit dem Modul mod_headers. Hier können die Dateitypen direkt über die Dateiendungen angesprochen werden und nicht via MIME-Types:

a2enmod headers
/etc/init.d/apache2 restart

Nachdem das Modul aktiviert wurde, kann folgender Teil wieder direkt in die .htaccess Datei oder in die Apache Konfiguration eingetragen werden.

<IfModule mod_headers.c>
<FilesMatch "\.(gif|ico|jpeg|jpe|png|css|js)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
</IfModule>

Header set Cache-Control setzt den Wert für max-age auf 604800 Sekunden (7 Tage). Dem Browser wird somit mitgeteilt, dass die gespeicherten Dateien für 7 Tage aktuell sind und nicht erneut vom Server geladen werden müssen. Wenn man für andere Dateitypen noch verschiedene Ablaufdaten festlagen möchte, dann kann einfach eine weitere Zeile (<FilesMatch …. </FilesMatch>) eingefügt werden.

Auswirkung und Fazit

Sobald die htaccess Datei gespeichert wird, ist das Browser Caching aktiv. Eine Aktualisierung des Google Page Speed Insights sollte dabei sofort eine Score Verbesserung anzeigen:

Google PageSpeed Insights mit aktiviertem Caching

Der Score nur durch die Aktivierung des Browser Caching von 87 auf 90 gestiegen. Das mag auf den ersten Blick nicht viel erscheinen, bringt aber tatsächlich ein wenig Geschwindigkeit und sollte daher auch genutzt werden. Warum Potential verschenken, wenn es so einfach umgesetzt werden kann? 😉

Weitere Verbesserungsmöglichkeiten bietet die gzip Komprimierung einer Website und die Verwendung eines OPcache für PHP.

HowTo: Browser Caching im Apache Webserver aktivieren + htaccess mit mod_expires oder mod_headers
4.29 (85.71%) 14 Bewertungen

Auch cool

HowTo: Oracle Java 8 JRE / JDK- Installation und Upgrade unter Debian Wheezy

Anleitung zur Installation von Oracle Java 8 unter Debian Wheezy und Upgrade von Java 7 auf …

7 Kommentare

  1. Danke für den sehr hilfreichen Artikel! Hab mal wieder was dazu gelernt :)!

    Grüße, Holger K.

  2. Danke. Das man dieses auch gleich im mod_headers so hin bekommt war mir noch gar nicht bewußt. Hab expires auch bis jetzt nur bei high traffic websites eingesetzt … doch so gesehen tut man dem user ja auch was Gutes.

  3. Danke!! Meine Rettung! genau diese kleine Teil hat mir gefählt und wollte nicht funktionieren!!
    „max-age=604800, public“

    • Das hilft mir auch sehr, mir hat genau der gleiche Schnipsel Code gefehlt. Nur durch deinen Komentar habe ich nochmal genauer gelesen 😉

  4. Zitat:
    „Nachdem das Modul aktiviert wurde, kann folgender Teil wieder direkt in die .htaccess Datei oder in die Apache Konfiguration eingetragen werden.“
    Zitat:ende
    so welche config datei?
    apache2.conf
    oder httpd.conf

  5. Hallo, habe die letzten 2 Tage damit verbracht mich mit dem Thema zu beschäftigen:

    Der Anleitung wie oben gefolgt, aber funktioniert leider nicht. Die module headers und expires laufen (wurde geprüft) einträge in die .htaccess gemacht, aber bei der pagespeed analyse zeit er weiterhin an das die Dateien kein Ablaufdatum haben. ( bei dem mod deflate verhält es sich eben so)

    !!!!! Hat jemand eine Idee ?????

    Auszug aus der htaccess Datei:

    ExpiresActive On
    ExpiresDefault „access plus 1 month“
    ExpiresByType text/html „access plus 1 month“
    ExpiresByType image/gif „access plus 1 month“
    ExpiresByType image/jpeg „access plus 1 month“
    ExpiresByType image/png „access plus 1 month“
    ExpiresByType text/css „access plus 1 month“
    ExpiresByType text/javascript „access plus 1 month“
    ExpiresByType application/x-javascript „access plus 1 month“
    ExpiresByType text/xml „access plus 3600 seconds“

    # Turn on compression

    AddOutputFilterByType DEFLATE text/plain text/html text/xml
    AddOutputFilterByType DEFLATE text/css text/javascript text/x-js
    AddOutputFilterByType DEFLATE application/xml application/xhtml+xml
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/javascript application/x-javascript

    Header set Cache-Control „max-age=604800, public“

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.