Websiteprestaties en laadsnelheid
Een aantrekkelijke website of sterke content alleen is tegenwoordig niet meer voldoende om bezoekers vast te houden. De laadsnelheid van uw website speelt een belangrijke rol, zowel voor gebruikers als voor zoekmachines zoals Google.
Google gebruikt laadsnelheid als één van de factoren om de positie van websites in de zoekresultaten te bepalen. Wanneer een website meerdere seconden nodig heeft om te laden, kan dit leiden tot een lagere ranking én tot afhakers onder bezoekers.
Uit statistieken blijkt dat bijna de helft van de internetgebruikers verwacht dat een website binnen twee seconden of minder volledig is geladen. Gelukkig kunnen prestaties vaak met relatief eenvoudige optimalisaties aanzienlijk worden verbeterd.
Optimaliseren met het .htaccess-bestand
Er bestaan verschillende technieken om de laadtijd van een website te verbeteren. Eén van de snelste en meest effectieve methoden is het optimaliseren van het .htaccess-bestand. Hiermee kunnen basisoptimalisaties zoals compressie en browsercaching binnen enkele minuten worden toegepast.
Compressie inschakelen
Compressie verkleint de grootte van bestanden voordat deze naar de browser worden verzonden. Dit is vooral effectief voor HTML-, CSS-, JavaScript- en XML-bestanden. In de praktijk kan compressie de bestandsgrootte met 60% tot 80% verminderen.
Door compressie in te schakelen:
Wordt de laadtijd van pagina’s korter
Wordt minder bandbreedte verbruikt
Reageert de server sneller
Voor Apache-webservers worden hiervoor meestal de modules mod_deflate of mod_gzip gebruikt. Beide doen in essentie hetzelfde, maar mod_deflate wordt beter ondersteund en is eenvoudiger te configureren.
Compressie via mod_deflate
Plaats onderstaande code in het .htaccess-bestand:
# BEGIN DEFLATE COMPRESSION AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/truetype AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml # END DEFLATE COMPRESSION
Compressie via mod_gzip (alternatief)
Wanneer mod_deflate niet beschikbaar is, kan mod_gzip worden gebruikt:
# BEGIN GZIP COMPRESSION mod_gzip_on Yes mod_gzip_dechunk Yes mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$ mod_gzip_item_include handler ^cgi-script$ mod_gzip_item_include mime ^text/.* mod_gzip_item_include mime ^application/x-javascript.* mod_gzip_item_exclude mime ^image/.* mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*$ # END GZIP COMPRESSION
Browsercaching instellen
Met browsercaching geeft u de browser instructies om bepaalde bestanden tijdelijk lokaal op te slaan. Hierdoor hoeven deze bestanden bij een volgend bezoek niet opnieuw van de server te worden opgehaald.
Dit zorgt voor:
Snellere laadtijden bij terugkerende bezoekers
Minder serverbelasting
Minder dataverkeer
Voor browsercaching worden meestal de Apache-modules mod_expires en mod_headers gebruikt.
Expires headers instellen
# BEGIN EXPIRES HEADERS ExpiresActive On ExpiresDefault "now plus 1 hour" ExpiresByType text/css "now plus 1 week" ExpiresByType application/javascript "now plus 1 week" ExpiresByType application/x-javascript "now plus 1 week" ExpiresByType image/bmp "now plus 1 month" ExpiresByType image/gif "now plus 1 month" ExpiresByType image/jpeg "now plus 1 month" ExpiresByType image/png "now plus 1 month" ExpiresByType image/svg+xml "now plus 1 month" ExpiresByType image/x-icon "now plus 1 month" ExpiresByType font/truetype "access plus 1 month" ExpiresByType font/opentype "access plus 1 month" ExpiresByType application/x-font-woff "access plus 1 month" # END EXPIRES HEADERS
Cache-Control headers instellen
In combinatie met mod_expires is het meestal niet nodig om expliciet een max-age op te geven. In situaties waarin dit wel nodig is, kan de volgende configuratie worden gebruikt:
# BEGIN Cache-Control Headers Header set Cache-Control "public" Header set Cache-Control "private, must-revalidate" # END Cache-Control Headers
Of, indien mod_expires niet wordt gebruikt:
# BEGIN Cache-Control Headers Header set Cache-Control "max-age=2592000, public" Header set Cache-Control "max-age=604800, public" Header set Cache-Control "max-age=600, private, must-revalidate" # END Cache-Control Headers