Thuis of op kantoor heb je een razendsnelle glasvezelverbinding. Met die hoge bandbreedte verwacht je dat elke website die je bezoekt onmiddellijk op je scherm verschijnt. Toch merk je regelmatig dat een site traag laadt. Sterker nog, het gebeurt zelfs bij je eigen site. Erg frustrerend. Hoe kan dat nou?
In dit artikel ontdek je dat je internetsnelheid maar voor een klein deel bepaalt hoe snel websites worden geladen. In de kettingreactie van verzoeken en antwoorden zijn er voor website-eigenaren zoals jij gelukkig veel dingen die je zelf kunt doen om die traagheid op te lossen.
De snelheid van een website wordt voor een groot deel bepaald door de reactietijd van de server. Hoewel jouw internetverbinding een grote hoeveelheid data per seconde kan verwerken, ben je voor de start van het laadproces volledig afhankelijk van de host. Zodra je een URL intypt, stuur je een verzoek naar de server. De tijd die de server nodig heeft om dit verzoek te verwerken en de eerste gegevens terug te sturen, noemen we de Time To First Byte (TTFB).
Er zijn verschillende redenen waarom een server traag reageert:
Als de server waarop jouw website staat niet optimaal presteert, ontstaat hier de eerste vertraging. Met andere woorden: jouw internetverbinding staat klaar om de data te ontvangen, maar de server is nog bezig met het genereren van de pagina. De focus bij het versnellen van een site moet daarom altijd liggen op de reactietijd van de hostingomgeving.
Dataverkeer is gebonden aan fysieke afstanden. Hoewel data met bijna de lichtsnelheid door glasvezelkabels reist, zorgt elke kilometer afstand voor een kleine toename in de laadtijd. Voor jouw bezoekers maakt het daarom een meetbaar verschil of jouw server in Nederland staat of in een datacenter aan de andere kant van de wereld.
Bij een website met veel kleine bestanden tikt die vertraging flink aan. Elke keer dat de browser een verzoek doet (een HTTP-request), moet dat verzoek de volledige afstand afleggen naar de server en weer terug. Dit noemen we de Round Trip Time (RTT). Wanneer een pagina 80 verschillende verzoeken doet, kan een kleine afstand al snel leiden tot een vertraging van meerdere seconden.
Dit kun je ondervangen door gebruik te maken van een Content Delivery Network (CDN). Hiermee worden kopieën van je website opgeslagen op servers wereldwijd. Zo halen bezoekers hun data op bij de dichtstbijzijnde fysieke serverlocatie. Die kortere weg minimaliseert de vertraging.
Een bijkomend voordeel van een CDN is dat je eigen centrale server niet langer elk afzonderlijk verzoek hoeft af te handelen. Statische bestanden, zoals afbeeldingen, CSS-bestanden en scripts, worden door het CDN opgevangen en geserveerd. Dit ontlast de processor en het geheugen van je eigen hostingpakket.
En als één specifieke server in het netwerk uitvalt of kampt met een storing, wordt het verkeer automatisch omgeleid naar een andere actieve server. Hierdoor blijft je website altijd online en bereikbaar.
Voordat je browser gegevens van een server kan ophalen, moet het bijbehorende IP-adres worden opgezocht. Dit gebeurt via het Domain Name System (DNS). Wanneer de nameservers van je domeinnaamprovider traag reageren, ontstaat er een pauze in de browser.
Een trage DNS-service kan per verzoek voor een vertraging zorgen. Hoewel deze informatie vaak tijdelijk wordt opgeslagen na een eerste bezoek, wat we caching noemen, blijft een snelle DNS-verbinding essentieel voor de eerste indruk van een nieuwe bezoeker.
Een provider kiezen met een krachtige DNS-infrastructuur is daarom belangrijk voor het optimaliseren van de totale snelheid. Bij Vimexx investeren we continu in de snelheid van onze nameservers, zodat de vertaling van domeinnaam naar IP-adres nagenoeg instantaan gebeurt.
De snelheid van je website hangt sterk samen met de rekenkracht van de server, zoals de processor en het werkgeheugen. Bij veel standaard hostingpakketten deel je deze kracht met andere websites. Als je buren op de server erg druk zijn, blijft er minder energie over voor jouw verzoeken, waardoor je website trager reageert.
Daarnaast moet de server bij elk bezoek hard werken om informatie uit de database te halen en plug-ins te laten draaien. Wanneer je database vol staat met oude gegevens of wanneer plug-ins ingewikkelde opdrachten geven, moet de server langer nadenken voordat een pagina getoond wordt. Ook de fysieke opslag is bepalend; de moderne NVMe-schijven die Vimexx gebruikt, lezen gegevens veel sneller dan ouderwetse harde schijven, wat de laadtijd direct verkort.
Tot slot speelt latency een rol. Dit is de tijd die data nodig heeft om van de server naar de computer van je bezoeker te reizen. Door de afstand klein te houden of een netwerk van servers (CDN) te gebruiken, verlaag je deze vertraging. Als je merkt dat je website ondanks optimalisaties traag blijft, heb je waarschijnlijk meer eigen bronnen nodig. Een overstap naar een krachtiger pakket lost deze technische opstoppingen vaak direct op.
Het laadproces van een website bestaat uit twee fundamentele delen: de backend en de frontend. De backend is het gedeelte waar de server de code uitvoert en de database raadpleegt om de uiteindelijke HTML-code van de pagina te genereren. De frontend is vervolgens de code die door de browser van de bezoeker wordt verwerkt, zoals afbeeldingen, teksten, CSS-opmaak en JavaScript-functies.
Een snelle server is noodzakelijk, maar als de website aan de voorkant niet goed is ingericht, blijft de ervaring voor de bezoeker traag. Want zelfs met een gigabit-verbinding moet de browser de volgende stappen doorlopen:
Veel websites bevatten tegenwoordig grote hoeveelheden code en zware mediabestanden. Een lichte en efficiënte frontend is daarom net zo belangrijk als een snelle server. Als de frontend-architectuur gebrekkig is, zal de site traag aanvoelen op elk type internetverbinding.
Eén van de meest voorkomende redenen voor een trage website, ondanks een snelle verbinding, is het onjuist gebruik van media. Hoewel jij de data snel kunt binnenhalen, is het voor de prestaties van de site essentieel dat de totale paginagrootte beperkt blijft. Een pagina die 15 megabytes groot is omdat er ongecomprimeerde foto's op staan, zal nooit 'flitsend' aanvoelen.
Het optimaliseren van media is daarom één van de eerste stappen die je moet zetten:
Wanneer een bezoeker een mobiel apparaat gebruikt, is de impact van zware afbeeldingen nog groter. Een mobiele browser kan moeite hebben met het tegelijkertijd verwerken van meerdere grote bestanden. Door je media ‘slank’ te houden, zorg je ervoor dat de techniek aan de gebruikerskant niet de bottleneck wordt.
Een modern probleem voor websites is de afhankelijkheid van externe partijen, aangezien bijna elke site tegenwoordig scripts van derden gebruikt. Denk hierbij aan lettertypes van Google Fonts, advertentie-pixels van Facebook, of meetinstrumenten van Google Analytics.
Voor elk van deze onderdelen moet de browser van je bezoeker contact maken met een andere server dan die van jouw eigen host. Dit proces brengt aanzienlijke risico's voor de snelheid met zich mee, omdat je website vaak stopt met laden wanneer een externe server traag reageert. Veel van deze scripts werken bovendien blokkerend: de weergave van de rest van de pagina wordt tegengehouden totdat het betreffende script binnen is.
Daarnaast kost het opzetten van beveiligde verbindingen met al die verschillende externe domeinen extra tijd, wat voor een merkbare vertraging zorgt. Hierdoor ziet een bezoeker soms een wit scherm, zelfs als de eigen internetverbinding uitstekend werkt. Het is daarom verstandig om het aantal externe ‘calls’ te minimaliseren, bijvoorbeeld door lettertypes of scripts lokaal te hosten op je eigen server.
De programmeertaal PHP bepaalt hoe efficiënt de server jouw website opbouwt. Nieuwe versies van deze taal zijn vaak 20% tot 30% sneller dan hun voorgangers. Draait je site op een verouderde PHP-versie, dan verbruikt de server onnodig veel rekenkracht. Je bezoeker moet dan wachten op data die met een actuele versie al lang ontvangen had kunnen zijn.
Naast de programmeertaal is het belangrijk om de andere lagen van je website actueel te houden:
Snelheid is niet alleen een technische meting in seconden; het is ook een beleving. Dit noemen we de waargenomen snelheid. Wanneer een bezoeker met een snelle internetverbinding op jouw site komt, is de verwachting van een directe reactie heel hoog. Elke seconde vertraging voelt voor deze gebruiker langer aan dan voor iemand met een trage verbinding die gewend is te wachten.
Onderzoek wijst uit dat de kans op een bounce (het direct verlaten van de site) extreem snel stijgt na de grens van twee seconden.
Je kunt de ervaring verbeteren door de volgorde van het laden aan te passen. Door de tekst en de menustructuur als eerste te tonen, kan de bezoeker al beginnen met navigeren terwijl de zwaardere visuele elementen op de achtergrond worden binnengehaald. Dit verlaagt de drempel om op de site te blijven, zelfs als de totale laadtijd technisch iets langer is.
Als je wilt achterhalen waarom je website niet de gewenste snelheid behaalt, is het verstandig om objectieve data te verzamelen. Er zijn verschillende tools die je precies laten zien waar de bottleneck zit. Het is aan te raden om deze tests regelmatig uit te voeren, vooral nadat je nieuwe plug-ins hebt toegevoegd of grotere wijzigingen aan de content hebt gedaan.
Enkele waardevolle tools zijn:
Met de resultaten uit deze tools kun je gericht actie ondernemen. Zie je bijvoorbeeld een hoge 'Initial Server Response Time'? Dan weet je dat het probleem bij je host of je database ligt. Zie je veel meldingen over 'Large Contentful Paint'? Dan moet je waarschijnlijk je afbeeldingen beter optimaliseren.
Een snelle website is een optelsom van efficiënte code, geoptimaliseerde media en een krachtige server. Jouw eigen snelle internetverbinding kan technische beperkingen aan de kant van de server of de code simpelweg niet compenseren.
Merk je dat jouw site traag laadt, dan is het tijd voor actie. Gebruik de bovenstaande tools om te bepalen waar urgente actie nodig is. Maar ook na die eerste optimalisaties moet je kritisch blijven op plug-ins die je installeert en afbeeldingen die je uploadt.
Blijkt jouw website traag aan de kant van de server, dan kan het tijd zijn voor een ander pakket of een andere host. Bij Vimexx bieden we oplossingen die specifiek zijn ontworpen voor maximale prestaties en korte laadtijden.
Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur?
