. .

expire headers • Leverage browser caching

expire headers

Das Modul mod_expires bietet die Möglichkeit die Einstellung der Expires-Header und dem Cache-Control: max-age-Header im HTTPInformationBedeutung: HTTPHypertext Transfer Protocol deutsch: Hypertext-Übertragungsprotokoll; Protokoll zur Übertragung von Daten über ein Netzwerk; Um Webseiten und andere Daten aus dem World Wide Web in einen Browser zu laden.-Response, also der Antwort des Servers zum Client als Reaktion auf die Anfrage, zu modifizieren.


Cache-Einstellungen werden via HTTP-Header an den Browser mitgesandt. Der Expires-Header beispielsweise gibt an, wann die vom Browser zwischengespeicherte Version der Datei abläuft und er eine neue Version laden soll. Für statische Ressourcen wie Grafiken, CSSInformationBedeutung: CSSCascading Style Sheets, dt. deklarative Stylesheet-Sprache für strukturierte Dokumente- und JavaScriptInformationBedeutung: JavaScriptJavaScript eine Skriptsprache, hauptsächlich für dynamische Webseiten eingesetzt-Dateien setzt man die Cachedauer relativ hoch. In der Page Speed Hilfe wird für Expires ein Minimum von einem Monat bis hin zu einem Jahr empfohlen.

<IfModule mod_expires.c>
FileETag All
ExpiresActive On

ExpiresDefault "access plus 4 weeks" # expire png|gif|jpg|jpeg|ico images after 2 month # Expire headers 5184000 Sekunden = 2 Monate ExpiresByType image/png "access plus 5184000 seconds" ExpiresByType image/gif "access plus 5184000 seconds" ExpiresByType image/jpg "access plus 5184000 seconds" ExpiresByType image/jpeg "access plus 5184000 seconds" ExpiresByType image/x-icon "access plus 5184000 seconds"
# expire css style after a month ExpiresByType text/css "access plus 2592000 seconds"
# expire javascript after a month ExpiresByType text/javascript "access plus 2592000 seconds" ExpiresByType application/x-javascript "access plus 2592000 seconds"
ExpiresByType text/htm "modification plus 604800 seconds" ExpiresByType text/html "modification plus 604800 seconds" ExpiresByType text/php "modification plus 604800 seconds" ExpiresByType text/xml "modification plus 604800 seconds" </IfModule>

Bei der Verwendung von mod_expires wird automatisch ein passender Cache-Control: max-age-Header berechnet und einfügt. base bzw. code definiert die Basis für die Berechnung der Zeit, bei Einsatz von modification bzw. M wird der Zeitpunkt der letzten Änderung der Datei als Startzeit zur Ermittlung der Caching-Dauer verwendet. Bei Einsatz von access bzw. A wird für die Ermittlung der Startzeit der Caching-Dauer der Zeitpunkt des Client-Zugriff auf die Datei verwendet.

ExpiresByType type/encoding "base [plus num type ] [ num type ] ..."
ExpiresByType image/gif "access plus 2 months 1 weeks 1 days"
ExpiresByType MIME-type <code>seconds ExpiresByType image/gif A5184000

cache expiration • Leverage browser caching

cache expiration

Das Modul mod_headers bietet die Möglichkeit die Einstellung des Cache-Control: max-age-Header im HTTPInformationBedeutung: HTTPHypertext Transfer Protocol deutsch: Hypertext-Übertragungsprotokoll; Protokoll zur Übertragung von Daten über ein Netzwerk; Um Webseiten und andere Daten aus dem World Wide Web in einen Browser zu laden.-Request und HTTPInformationBedeutung: HTTPHypertext Transfer Protocol deutsch: Hypertext-Übertragungsprotokoll; Protokoll zur Übertragung von Daten über ein Netzwerk; Um Webseiten und andere Daten aus dem World Wide Web in einen Browser zu laden.-Response zu modifizieren. Die Verwendung von Cache-Control im mod_headers Modul ersetzt die Expires des Moduls mod_expires.

<IfModule mod_headers.c>
Header set Vary Accept-Encoding
<FilesMatch "\.(gif|jpe?g|png|ico|swf)$"> Header set Cache-Control "max-age=5184000, public" </FilesMatch>
<FilesMatch "\.(css)$"> Header set Cache-Control "max-age=2592000, private" </FilesMatch>
<FilesMatch "\.(js)$"> Header set Cache-Control "max-age=2592000, private" </FilesMatch>
<FilesMatch "\.(x?html?|php|xml)$"> Header set Cache-Control "max-age=604800, private, must-revalidate" </FilesMatch>
</IfModule>

php header • Leverage browser caching

php header()

Sollte ein Zugriff auf die Konfiguration von Apache via .htaccess nicht möglich sein, kann der Browser-Cache per php header() definiert werden. Die entsprechenden Dateien werden durch Hinzufügen der Dateiendung style.css.php bzw. global.js.php in php-Dateien und an den Anfang des Quelltextes der Datei wird der folgende Code eingefügt.


<?php header('Content-type:text/html;charset=UTF-8');
header("Cache-Control:must-revalidate");
$offset = 60 * 60 * 24 * 14;
header('Vary:Accept-Encoding');
header('Cache-Control:max-age=' . $offset);
header('Expires:' . gmdate('D,d M Y H:i:s',time() + $offset) . ' GMT');
$fp = fopen($_SERVER["SCRIPT_FILENAME"],"r"); $etag = md5(serialize(fstat($fp))); $mtime = filemtime($_SERVER["SCRIPT_FILENAME"]);
fclose($fp); header('Last-Modified:' . gmdate('D,d M Y H:i:s',$mtime) . ' GMT');
header('Etag:'.$etag);
?>


Linkempfehlungen

Verweise & Links


» zum Seitenanfang

PageSpeed-Optimierung

mehr zum Thema: Browser-CachingLeverage browser caching

Für statische Ressourcen der Webseite, wie Grafiken, JavaScript- und CSS-Dateien das Browser-Caching aktivieren.

» mehr zum Thema: Browser-Cachingmehr lesen

mehr zum Thema: CSS-Dateien kombinierenCombine external CSS

Alle externen CSS-Dateien mittels PHP kombinieren und so die Anzahl der HTTP-Requests reduzieren.

» mehr zum Thema: CSS-Dateien kombinieren • Combine external CSSmehr lesen


mehr zum Thema: JavaScript-Dateien kombinierenCombine JavaScript

Alle externen JavaScript-Dateien mittels PHP kombinieren und so die Anzahl der HTTP-Requests reduzieren.

» mehr zum Thema: JavaScript-Dateien kombinieren • Combine external JavaScriptmehr lesen

mehr zum Thema: JavaScript-Dateien später ladenDefer loading of JavaScript

Externen JavaScript-Dateien später laden, sodass andere Ressourcen parallel heruntergeladen werden können und das Laden der Webseite beschleunigt wird.

» mehr zum Thema: JavaScript-Dateien später laden • Defer loading of JavaScriptmehr lesen

mehr zum Thema: JavaScript-Dateien später parsenDefer parsing of JavaScript

Alle externen JavaScript-Dateien später parsen um den Aufbau der Webseite für den Nutzer so schnell wie möglich zu realisieren.

» mehr zum Thema: JavaScript-Dateien später parsen • Defer parsing of JavaScriptmehr lesen




Tastaturkürzel