Leverage browser caching
Wer seine Webseite mit Googles Page Speed analysiert, bekommt oft den Vorschlag die Ablaufzeit für statische Ressourcen festzulegen. Aber wie wird dies gemacht? Dies möchte ich euch heute in meinem kleinen Artikel zeigen.
Warum ist die Cache Ablaufzeit so wichtig?
Wenn keine Cache Zeit angegeben wird, kann der Browser frei entscheiden wie lang eine Ressource, wie z.B. ein Bild oder eine CSS-Datei, im Cache gehalten werden soll. Im schlimmsten Fall werden bei jeden Seitenaufruf alle Ressource neu geladen, was selbstverständlich ineffizient ist und die Ladezeit erhöht.
Was benötige ich für das Cachen von statischen Ressourcen?
Wenn ihr ein Apache als Webserver nutzt, benötigt ihr das Modul mod_expires. Mod_expires setzt den „Expires“-Header, der für die Cacheangaben benötigt wird. Desweitern wird Apache 2 standardmäßig mit mod_expires ausgeliefert, so dass keine Installation notwendig ist.
Wie wird mod_expires konfiguriert?
Es gibt mehrere Möglichkeiten. Wenn ihr Zugriff auf die Konfigurationsdateien des Webservers habt, kann dies dort direkt eingestellet werden. Wer keinen Zugriff auf die Konfigurationsdateien hat, kann mod_expires via .htaccess einstellen.
Allgemein
ExpiresActive on|off -> Aktiviert/Deaktiviert den „Expires“-Header
ExpiresDefault „<base> [plus] {<num> <type>}*“ -> Standard Ablaufzeit
ExpiresByType type/encoding „<base> [plus] {<num> <type>}*“ -> Setzt den „Expires“-Header für ein bestimmten Type, z.B. image/gif
Weitere Informationen findet ihr unter Module mod_expires
Beispiel:
ExpiresByType image/gif “access plus 3 month 2 days 1 seconds”
ExpiresByType text/css “access plus 1 years”
Weitere Zeitangaben sind years, months, weeks, days, hours, minutes und seconds.
mod_expires via .htaccess
Erstellt euch eine neue Datei mit dem Namen .htaccess und fügt diesen Text hinein:
1 2 3 4 5 6 7 8 9 | <IfModule mod_expires.c> ExpiresActive On ExpiresDefault "access plus 1 month" ExpiresByType text/html "access plus 6 month" ExpiresByType image/gif "access plus 1 years" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType text/css "access plus 6 month" ExpiresByType text/javascript "access plus 6 month" </IfModule> |
Speichert diese Datei und legt sie in euren Rootverzeichnis eures Webservers ab. Wenn euer Provider dies zulässt und mod_expires installiert ist, wird ab sofort ein „Expires“-Header gesendet. Testet dies am besten mit Firebug und PageSpeed.
Das war es eigentlich schon mit Cache-Controlling für statische Ressoucren. Ich hoffe euch hat dieser Artikel gefallen. Bei Fragen oder Kritik steh ich euch gern zur Verfügung.
Schlagwörter: Caching, Performance, Webseiten
Anne sagt
am 1. August 2011 @ 12:17
Vielen Dank für den Code. Nach einfügen in die htaccess brachte das ganze 7 Punkte im Page Speed. Top 🙂 LG Anne
Christian sagt
am 28. Mai 2012 @ 18:53
Danke für die Info’s!
Gibt es auch eine möglichkeit sowas auf einen Windows Server zu aktivieren?
admin sagt
am 29. Mai 2012 @ 14:07
Ich geh jetzt mal davon aus das du einen IIS meinst!?
Wenn ja, könnte das hier hilfreich sein:
– http://goo.gl/Ul3Wa
– http://goo.gl/iVCZs
LG
Julius