Probeer je al een tijdje om je website sneller te maken, maar blijft het gewenste resultaat uit? Denk dan eens aan het implementeren van HTTP/2.
Onlangs sprak Fili Wiese op Friends of Search over technische mogelijkheden om de laadtijden van websites te verbeteren. Eén van de verbeteringen die hij aandroeg is het implementeren van HTTP/2.
Momenteel gebruikt slechts 12,9 % van de websites HTTP/2.
Veel websites maken nog geen gebruik van dit protocol dus liggen er (SEO-)kansen voor websites die er wél mee geoptimaliseerd zijn. Om te begrijpen waarom dat zo is, is het handig om nog even de basis door te nemen:
HTTP staat voor Hypertext Transfer Protocol, een serie regels voor het uitwisselen van bestanden tussen de browser en een server. Aan de hand van verzoeken (requests genaamd) en antwoorden (responses).
Een voorbeeld van een dergelijke interactie is dat er een afbeelding of ander pagina-element geladen moet worden. Wat business as usual is, maar iedere request aan de server kost tijd en kán dus ten koste gaan van de laadtijd en gebruikservaring.
HTTP/2 is de update van HTTP 1.1 Met direct goed nieuws: voor de implementatie ervan hoef je bestaande websites niet aan te passen.
Het grote verschil zit hem in de manier hoe de data wordt neergezet en verstuurd tussen de browser en server. In plaats van dat de browser voor iedere actie een request aan de server stuurt (pull), stuurt de server na één request álle data mee (push) naar de browser.
Als de server bijvoorbeeld ziet dat iemand een artikel wil lezen, ‘weet’ de server dat er ook die afbeelding bij hoort. Voorheen werden die elementen per stuk aangevraagd. Door ze te bundelen, reduceert het aantal requests en responses aanzienlijk.
Als je dat visueel weergeeft, ziet dat er zo uit:
Als je dit nog aantrekkelijker wil weergeven, is het verschil tussen HTTP/1 en HTTP/2 ook zo te verbeelden:
Lekker snel! En het is bij HTTP/2 niet meer nodig om Javascripts, CSS en afbeeldingen te comprimeren. Sterker nog, het kan zelfs schadelijk zijn voor de werking van de website.
De werking van HTTP/2 doet misschien een beetje denken aan ‘Keep alive’, maar dat werkt net weer wat anders.
Keep alive zet een constante verbinding tussen de server en browser op, waardoor de browser niet steeds ‘op de serverdeur hoeft te kloppen’ om data op te vragen. Dit scheelt al in de laadtijd, maar het kan nog sneller met HTTP/2.
Daar wordt immers alle data die nodig is voor het laden van die specifieke pagina in één keer (synchroon) ingeladen.
De presentatie van Fili Wiese was de inspiratie voor mijn Searchresult-collega Gregory Pinas om op zijn website Provefit.nl te testen wat het effect was van de implementatie van HTTP/2.
Hij heeft meerdere aanpassingen doorgevoerd, om betere prestaties af te dwingen, zoals de toevoeging van een CDN, PHP7 en Cache Content. De resultaten laten een grote verbetering zien:
In bovenstaande screens is het effect van HTTP/2 duidelijk zichtbaar. In de rechterafbeelding (HTTP/2) is de communicatie tussen server en browser veel efficiënter ingericht.
De laadtijd van de website (eerste bezoek) is van iets meer dan 15 seconden naar ongeveer 4 seconden gegaan en nog opmerkelijker: de first byte is van 4,5 seconden naar 0,31 seconden gegaan.
Tot besluit is het aantal requests van 89 naar 57 gegaan. Dit zijn gigantische stappen, die de gebruikers van de website (en dus ook zoekmachines) zeker weten waarderen.
HTTP2 kan een zeer nuttige toevoeging zijn voor websites die op HTTPS-verbinding draaien. In onze eigen tests was de verbetering groot.
De moeite waard om je er eens in te verdiepen en ermee te testen op je eigen website.
Bovendien heeft de laadsnelheid van je pagina ook nog eens direct invloed op de conversieratio van je website.
Yay!
[Afbeelding © zakokor