gzip Komprimierung für Javascript & CSS

Die Seitenladegschwindigkeit wird nun auch zunehmend ein Kriterium für das google Ranking. Neben der response time vom Server ist die Übertragungsmenge für den Seitenaufbau ein entscheidender Faktor.

Alle modernen Browser - inklusive der mobilen Geräte - können inzwischen mit gzip komprimierten Dateien umgehen. Da es immer einen Fall-Back-auf eine nicht komprimierte Datei gibt, ist die Vorgehensweise auch völlig unproblematisch in Bezug auf ältere Browser.

Ein Bespiel der unterschiedlichen Dateigrößen am Beispiel jQuery Version 1.11:

Wir können also allein durch die Komprimierung der jQuery Lib rund 60 kB sparen. Da die gzip Komprimierung auch mit CSS Dateien funktioniert, werden wir bei Ausnutzung der Komprimierung eine deutliche Perfomancesteigerung feststellen.

Die Komprimierung kann TYPO3 für uns automatische übernehmen. Im Installtool werden folgende Konstanten gesetzt:

$TYPO3_CONF_VARS['BE']['compressionLevel'] = '9'
$TYPO3_CONF_VARS['FE']['compressionLevel'] = '9' 

Jetzt müssen wir noch im TypoScript unseres Templatesetups folgende Zeile ergänzen:

config.compressJs = 1 
config.compressCss = 1 

und in der htaccess die eine entsprechende Regel hinzufügen:

<filesmatch> 
   AddType "text/javascript" .gzip
</filesmatch> 
<filesmatch> 
   AddType "text/css" .gzip 
</filesmatch> 
AddEncoding gzip .gzip

Ob die gzip Komprimierung läuft, könnt ihr z.B. in der Firebug Konsole sehen. Unter “Netzwerk -> Alles” werden die Dateigrößen angezeigt.