Die Seitenladegeschwindigkeit und die Zeit, die ein Browser zum Rendern einer Website benötigt, beeinflusst maßgeblich die Usability einer Homepage. Das wissen auch die Suchmaschinen. Inbesondere Google hat die Seitenladegeschwindigkeit zum Ranking-Kriterium gemacht und gibt Webmastern mit den Pagespeed Tools Entwicklerwerkzeuge für Speed-Optimierungen an die Hand. Mit den folgenden Tipps und Tricks können Typo3 Webseiten meist einfach bessere Werte im Speedtest erzielen.
Optimieren der Serverkonfigurationen
Vielfach liegen die Schwächen gar nicht bei Typo3 selbst. Für gute Ergebnisse beim Pagespeed ist eine gute Serverkonfiguration nötig. Bei Apache Servern erfolgt dies in der Regel über die .htaccess-Datei. Die Kandidaten für die Optimierung sind die Aktivierung der GZIP Komprimierung per mod_deflate und das Senden der Headerdaten per mod_headers oder mod_expires.
GZIP Komprimierung aktivieren
Das Apache Modul mod_deflate komprimiert Daten vor dem Transfer. Ist ein solches aktives Modul in der Webserver-Software installiert, genügen zur Aktivierung der mod_deflate Komprimierung wenige Zeilen. Um HTML, XML, Javascript und CSS zu komprimieren, reichen die folgenden Zeilen in der mod_deflate-Sektion einer .htaccess-Datei:
AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript
Bekannte problematische Browser allgemein werden so ausgeschlossen:
BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
Für den passenden Umgang mit Proxys empfiehlt es sich, noch die folgene Zeile in der .htaccess zu ergänzen:
Header append Vary User-Agent env=!dont-vary
Speed-up durch Headerdaten fürs Cachen
Mit mod_headers oder mod_expires kann das Caching aktiviert und optimiert werden. Geladene Dateien cached der Browser, sofern diese durch passende Headerinformationen entsprechend markiert sind. Dies reduziert das Transfervolumen und somit auch die Ladegeschwindigkeit.
Zum Beispiel wird mit mod_expires in der .htaccess über die folgende Zeile eine Gültigkeit für gif-Dateien definiert:
ExpiresByType image/gif "access plus 1 months"
Neben Gif-Dateien gilt es natürlich auch Anweisungen in der .htaccess für weitere gewünschte Dateitypen anzulegen. Alternativ kann auch mod_headers mit Vary Accept.Encoding, Cache-Control mit max-age, public und FileETag none genutzt werden.
Tuning per Typo3 Extension
Mit der Extension Scriptmerger komprimiert das Enterprise CMS nach Bedarf CSS und JavaScript. Auch können mehrere CSS- oder JS-Dateien miteinander verbunden werden. Das reduziert die Anzahl der HTTP-Requests und erhöht so die Ladegeschwindigkeit. Die Extension ist mit umfangreichen Konfigurationsmechanismen ausgestattet, so dass die Kontrolle beim Seitenbetreiber bleibt. Die Konfiguration selbst erfolgt ganz praktisch per TypoScript.
Allgemeine Optimierungen für HTML, CSS und JS
Für einen guten Pagespeed gilt es auch, den Seitencode selbst zu optimieren. Dazu gilt es Umleitungen, HTML, CSS und JavaScript zu reduzieren. Kleine CSS- und JavaScript-Codeschnipsel sollten inline eingefügt werden. Bei CSS gilt es, <code>@import</code> zu vermeiden. Die Ladezeit bei Bildern kann oftmals durch CSS-Sprites optimiert werden. Zudem ist es ratsam, die Ressourcen unter einer konsistenten URL anzubieten. Zeichensatz und Bildabmessungen sind ebenfalls anzugeben.
