De laadtijd van je website testen met Firebug

De snelheid van je website is van groot belang. Hoe sneller, des te meer bezoekers en des te beter de ervaring van je bezoekers. Ook in zoekmachines scoor je beter, omdat je site beter bereikbaar is. Een manier om die snelheid te meten is de Firefox plug-in Firebug. Deze plug-in is – los van deze functionaliteit – bijzonder handig voor het ontwikkelen van je website.

Firebug installeren
Als je Firebug nog niet hebt geïnstalleerd, doe dit dan alsnog vanaf www.getfirebug.com. Herstart je browser en start met meten!

De laadtijd meten met Firebug
Klik op het icoontje rechts onderin je scherm om Firebug te openen (een groen rondje met een wit vinkje). Ga daar naar het Net tabblad. Je ziet nu iets wat lijkt op onderstaande afbeelding.

Wat zie je zoal in het testrapport?
1) Ieder element in je pagina krijgt een eigen regel. In elke regel staat
a) de naam van het element
b) het domein (je kunt ook elementen laden uit andere domeinen voor bijvoorbeeld statistieken)
c) de zwaarte van de pagina
d) de laadtijd in milliseconden
e) als de balk achter een element lichtgrijs is, dan komt het uit je cache
2) Onderaan de lijst zie je:
a) het totaal aantal elementen
b) het totale gewicht van alle elementen samen (en als er nog elementen in de cache zitten is dit erbij aangegeven)
c) de totale laadtijd van de pagina
3) Standaard zie je alle elementen. Als je boven op bijv CSS klikt zie je alle CSS stylesheet elementen.

Als je met je muis over een element gaat zie je het volledig pad van het element en (bij afbeeldingen) wordt de afbeelding getoond. Om de details van een element te zien, klik je op het plusje voor de naam of op de regel zelf.

Resultaten voor whelp.nl
In mijn geval bevat de homepage van whelp.nl 27 elementen, die samen 142kb zwaar zijn en in totaal 4,77 seconden kosten om in te laden. Van die 142kb komt 129kb uit de cache. Dus al met al zal na een eerste bezoek het inladen van de pagina een stuk sneller gaan. (Dit is een momentopname en zal per verzoek kunnen verschillen.)

De snelheid optimaliseren
Nu je deze informatie hebt, kan je zien welk element naar verhouding veel tijd vraagt. Bekijk hoe je dit element zou kunnen verbeteren. Denk hierbij aan verkleining van elementen (door compressie van afbeeldingen, een beter afbeeldingsformaat [bijv. jpg ipv gif voor kleurenfoto's] en compressie van bestanden) of het weglaten van elementen. Heb je op elke pagina echt ieder onderdeel nodig? Zo nee, bekijk dan of je per pagina beter kunt bepalen wat je echt moet inladen.
Zie ook mijn 10 tips om je website sneller te maken.

Andere tools om je laadtijd te meten
Probeer ook eens Pingdom.

Stem / Bookmark [?]