De snelheid van je website wordt steeds belangrijker omdat het lijkt alsof gebruikers steeds minder geduld hebben en eerder je website verlaten omdat ze te lang moeten wachten. En dit is zonde van al die tijd die je heb geïnvesteerd in het schrijven van goede content. Maar om je website sneller te maken moet je eerst weten waaraan het ligt. Hoe het laadproces in zijn werk gaat en welke vertragingen welke fases optreden leg ik in het onderstaande artikel uit.
Het laadproces
Het laden van een webpagina bestaat uit verschillende fases. Bij elke fase kan vertraging optreden. Het is daarom belangrijk om te weten hoe snel de webpagina per fase laadt zodat je de juiste oorzaak van de vertraging kan achterhalen.
Het initiële request
Wanneer iemand op een link klikt zal de browser een verzoek sturen naar de juiste webserver. In deze fase wordt via de DNS server het ip-adres van de webserver achterhaalt en het pagina verzoek (pagerequest) naar de webserver gestuurd. De webserver stuur vervolgens een response terug. De duur van Fase 1 wordt gemeten als Time To First Byte (TTFB). Oftwel hoelang duurt het voor de webserver 1 byte terugstuurt naar jouw browser.
Het ophaal proces
Wanneer de webpagina als HTML is opgehaald weet de browser welke scripts, afbeeldingen en stylesheets er nog meer moeten worden opgehaald. De webbrowser gaat dan kijken welke bestanden er nog in het eigen geheugen staan (browser-cache) en welke nog op het internet nog moeten worden opgehaald. De browser haalt alle stukjes op en gaat de webpagina op basis van de responses opmaken. Binnen dit ophaal proces zijn er een aantal deelfases. De belangrijkste zijn:
De webpagina begint vorm te krijgen maar werkt nog niet. Je ziet wel de pagina maar je kunt nog niet klikken.
De webpagina kan voor een gedeeltelijk gebruikt worden. Alle javascripts kunnen nu worden uitgevoerd in de browser.
Alle scripts zijn nu allemaal uitgevoerd en alle content in ingeladen.
Het ontdekken van de oorzaken van vertraging
Nu we zien hoe lang een fase duurt kunnen we beter de oorzaak en de oplossing voor een snellere website vinden. Hieronder een aantal mogelijke oorzaken/oplossingen per fase. Maar kijk zeker ook naar de mogelijke oplossingen die de optimalisatie tools voorstellen. En bedenk dat een paar kleine verbeteringen vaak grote snelheidswinsten kunnen opleveren.
Een lange time to first byte fase
Dit zou kunnen komen doordat de webserver het heel druk heeft waardoor het lang duurt voordat je een response krijgt. Webserver caching van requests zorgt ervoor dat de webserver meer en sneller request kan afhandelen. Ook een goede hostingpartij kan ervoor zorgen dat jouw TTFB zo kort mogelijk wordt.
Een lange first contentful paint of time to interactive fase
Wanneer het lang duurt voordat een gebruiker iets kan doen, is de oorzaak vaak dat er teveel data moet worden opgehaald. Vaak zijn te grote afbeeldingen op een pagina hiervan de oorzaak. Zorg ervoor dat je afbeeldingen optimaliseert voordat je toont op een webpagina.
Een lange fully loaded time
Eenmaal ingeladen wordt er door de webpagina nog vaak veel javascript code onderwater uitgevoegd. Denk bijvoorbeeld aan Google Analytics of andere tracking software. Hoe meer (externe) scripts een webserver moet uitvoeren hoe langer deze tijd duurt. Wees dus kritsch op wat je allemaal op je website wilt uitvoeren.
Het optimalisatie proces
Denk je de oorzaak/oorzaken gevonden te hebben waarom jouw website traag is, wil je graag weten wat het effect is. Dit zou je terug moeten zien in de performance tools. Zorg daarom ervoor dat je regelmatig de webpagina controleert op snelheid zodat je zeker weet dat de pagina’s snel blijven.
