Begrippenlijst · Techniek & snelheid

Lighthouse

Ook wel: Google Lighthouse, PageSpeed-score, lab data

Definitie

Lighthouse is de open-source testtool van Google die een pagina in een gesimuleerde omgeving laadt en scoort op performance, toegankelijkheid, best practices en SEO.

Wat is Lighthouse?

Lighthouse is een gratis, open-source tool van Google. Je vindt hem in Chrome DevTools, onderin PageSpeed Insights en als command line-tool. Hij laadt een pagina één keer, met een vertraagde verbinding en een geëmuleerde middenklasse telefoon, en geeft scores op vier onderdelen: Performance, Accessibility, Best Practices en SEO.

De performance-score is een gewogen mix van lab-metrics: First Contentful Paint, Largest Contentful Paint, Total Blocking Time, Cumulative Layout Shift en Speed Index. Dit heet lab data: een gecontroleerde meting, geen echte bezoekers.

Omdat het een lab-test is, krijg je elke keer een herhaalbare situatie: geen cache, geen ingelogde klant, geen eerdere bezoeken. Dat maakt Lighthouse geschikt om twee versies van een pagina met elkaar te vergelijken, en ongeschikt om te voorspellen wat je klanten ervaren.

Waarom de score niet je doel is

Google rankt niet op je Lighthouse-score. Voor Core Web Vitals telt de field data uit CrUX. Een 98 in Lighthouse met slechte field data is geen succes, en andersom kan een shop met een 60 in het veld prima scoren.

INP kan Lighthouse in een gewone laadtest niet meten, want er klikt niemand. Total Blocking Time is daar de vervanger: het geeft aan hoeveel lange JavaScript-taken de main thread blokkeren, wat een indicatie is voor trage interacties.

De score schommelt ook. Dezelfde pagina kan per run een paar punten verschillen door netwerk, serverbelasting en extensies in je browser. Test in een incognitovenster en vergelijk meerdere runs.

De SEO-categorie controleert alleen basiszaken: een title, meta description, statuscode, crawlbare links en of de pagina niet geblokkeerd is. Een 100 betekent dat de basis er staat, niet dat je goed vindbaar bent.

Waar Lighthouse wel goed voor is

Debuggen. Lighthouse laat precies zien welk bestand render-blocking is, welke afbeelding te groot is en welk script de meeste main thread-tijd kost. Dat maakt het een goed gereedschap voor het vaste team dat de fix bouwt.

Regressies voorkomen. Met Lighthouse CI draai je bij elke release een test op vaste URL's: homepage, een categoriepagina, een productpagina en de winkelwagen. Zakt de score of groeit de JavaScript-bundel, dan zie je het voordat klanten het merken.

Test bij een webshop altijd de templates die omzet maken, niet alleen de homepage. En test met en zonder geaccepteerde cookies: na consent laden vaak de zwaarste scripts.

Lighthouse heeft ook een timespan-modus. Daarmee neem je een reeks handelingen op, zoals een filter kiezen of een product in de winkelwagen leggen, en zie je hoe zwaar die interacties zijn. Dat is de dichtstbijzijnde lab-benadering van INP.

Lighthouse vanaf de command line

npx lighthouse https://www.voorbeeldshop.nl/heren/sneakers \
  --only-categories=performance \
  --output=html --output-path=./sneakers.html

Verder lezen

Veelgestelde vragen

Moet ik naar een Lighthouse-score van 100?+

Nee. Google kijkt naar field data van echte gebruikers. Gebruik Lighthouse om problemen te vinden, niet als KPI.

Waarom verschilt PageSpeed Insights van Lighthouse in mijn browser?+

PageSpeed Insights draait op servers van Google met vaste instellingen. Je eigen browser heeft andere hardware, extensies en een andere verbinding.

Meer begrippen over techniek & snelheid

Liever dat iemand het voor je uitzoekt?

Wij controleren je webshop op deze punten en voeren de fixes zelf door in Magento, Shopify of Laravel. Je praat direct met het team dat het bouwt.