De snelheid van je website optimaliseren

De snelheid van een website heeft een enorme invloed op de gebruikservaring van een bezoeker. Naarmate het laden van je website langer duurt zal het geduld van de bezoeker afnemen. Er wordt gezegd dat de helft van webgebruikers verwachten dat een website binnen 2 seconden geladen is en dat ze zelfs afhaken als dit langer duurt dan 3 seconden. Dit afhaken wordt de bounce-rate genoemd en heeft een ernome invloed op conversie. Het belang van een snelle website is dus groot, zo groot zelfs dat snellere websites beloond worden met een hogere positie in de zoekresultaten van Google.

Time To First Byte

De tijd dat het kost nadat een webadres is ingetypt tot aan de eerste byte die binnenkomt heet de "Time To First Byte" (of TTFB) en wordt deels bepaald door de snelheid van het netwerk tussen de bezoeker en de website en deels door de tijd die de webserver nodig heeft om het verzoek af te handelen.

Ons hostingplatform is aangesloten op meerdere supersnelle verbindingen met het internet. Zodra er een webpagina bij ons wordt opgevraagd vindt er een aaneenschakeling van processen plaats om het juiste resultaat aan de bezoeker terug te kunnen geven. Stel bijvoorbeeld dat je een webpagina hebt waarop een stukje tekst staat dat uit een database komt. Zodra iemand deze pagina opvraagt trapt dat het volgende proces af:

  1. De bezoeker komt binnen op onze load-balancer, deze speelt het verzoek door naar één van de beschikbare achterliggende webservers
  2. De gekozen webserver start een apache proces op en leest vervolgens alle php bestanden van onze fileserver die met het verzoek geraadpleegd worden. Bij sommige cms-en of frameworks loopt dat op tot tientallen php bestanden die stuk voor stuk gecompileerd en uitgevoerd moeten worden
  3. Bij het uitvoeren van deze scripts wordt er een verbinding opgezet met de achterliggende database server en daarbij wordt om de verzochte tekst van de homepagina gevraagd
  4. Het php script voegt dan enkele templates en de content uit de database samen tot een html resultaat en geeft deze terug aan de webserver, die op zijn beurt deze terug geeft aan de load-balancer waarna deze naar de bezoeker wordt gestuurd

Zoals je merkt is dit nogal een onderneming en toch vindt dat hele proces vaak nog binnen een seconde plaats. Maar stel nu dat je direct daarna nog een bezoeker krijgt voor dezelfde pagina, deze zou ditzelfde proces opnieuw opstarten. Best wel zonde, want deze pagina is waarschijnlijk voor de tweede bezoeker niet veranderd. Dit is waar Server-side caching komt kijken en het is de sleutel tot het optimaliseren van de snelheid en schaalbaarheid van een website.

Verwerkingstijd

De tijd die de browser nodig heeft om de website volledig in te laden en te tonen wordt onder andere bepaald door het totaal aantal bytes en het aantal bestanden (plaatjes, css, javascript en dergelijke) dat hiervoor gedownload moet worden. Dit is goed te zien met behulp van de Chrome webdeveloper tools (druk in Chrome op F12 en ga naar de netwerk tab). Voor deze help pagina ziet dat er bijvoorbeeld zo uit:

Chrome developer network tab

Onderaan zie je dat er 28 verzoeken zijn en dat er 527KB bytes gedownload moest worden. De website was bruikbaar na 653 milliseconden seconden en volledig geladen na 1.57 seconden.

Om je verder te helpen met het optimaliseren van je website heeft Google een uitstekende tool ontwikkeld, genaamd PageSpeed, die de pijnpunten van je website bloot legt en tips biedt om deze op te lossen. En op WebPagetest.org vind je een hele handige tool om de laadtijd van je website verder te analyseren.