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: , ,

3 Kommentare bisher »

  1. 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

  2. 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?

  3. 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

Komentar RSS · TrackBack URI

Hinterlasse einen Kommentar

Name: (erforderlich)

eMail: (erforderlich)

Website:

Kommentar: