TYPO3-Website - Pagespeed erhöhen - Ladezeit verringern

Eine höhere Websitegeschwindigkeit sorgt nicht nur für den schnelleren Seitenwechsel oder eine höhere Usability des Nutzers. Der Aspekt Pagespeed wird auch bei Suchmaschinen ins Besondere Google immer wichtiger.

Testen kann man seine Website z.B. über Google Pagespeed Insights. Google sagt nicht nur, was alles im Argen liegt, sondern gibt auch Tipps und weiterführende Links, wie das Ganze verbessert werden kann.

Konfiguration TYPOSCRIPT

Hierbei werden die CSS/JS Dateien zu einer großen Datei zusammengefügt und komprimiert. Je mehr verschiedene Ressourcen geladen werden müssen umso langsamer wird die Website.

config {
sendCacheHeaders = 0
 
#Komprimiert / Squeezed CSS bzw. JS
compressCss = 1
compressJs = 1
 
#Fügt alle Dateien zu einer zusammen
concatenateCss = 1
concatenateJs = 1
}

Anpassungen in der .htaccess-Datei

Übermittelte Dateien an den Browser komprimieren

<IfModule mod_deflate.c>
<FilesMatch "\\.(html|css|js|xml|php|txt)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>

Cache Header für Dateien senden

<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 10 years"
ExpiresByType text/html "access plus 1 second"
ExpiresByType text/php "access plus 1 second"
ExpiresByType text/js "access plus 1 second"
ExpiresByType text/css "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/bmp "access plus 1 year"
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType application/x-shockwave-flash "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType application/x-javascript "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"
</IfModule>

Anpassung localconf.php / Install-Tool - große Log-Dateien bremsen TYPO3

$TYPO3_CONF_VARS['SYS']['systemLog'] = '0';
$TYPO3_CONF_VARS['SYS']['enableDeprecationLog'] = '0';

Sprites statt einzelner Grafiken nutzen

Wenn man viele kleine Grafiken, Icons oder Bullets nutzt, bietet es sich an diese in eine große Sprite-Datei zu verpacken. Dabei setzt man alle Grafiken nebeneinander und steuert die Ansicht über CSS mit Background-Position. Das hat den Vorteil, dass nur eine Grafik geladen und gecached werden muss.