Billeder er som regel de tungeste bytes på en side, så at optimere dem er den største LCP-gevinst. Tre håndtag: moderne formater, responsiv dimensionering og loading priority.
AVIF og WebP komprimerer langt mindre end JPEG/PNG ved samme kvalitet (AVIF ofte 50% mindre end JPEG). Server dem med en fallback, så gamle browsere stadig virker:
Send ikke et 2000px-billede til en 400px-telefon. srcset lader browseren vælge den rigtige størrelse til enheden:
<img
srcset="/p-400.jpg 400w, /p-800.jpg 800w, /p-1600.jpg 1600w"
sizes="(max-width: 600px) 100vw, 800px"
src="/p-800.jpg" width="800" height="600" alt="...">
sizes fortæller browseren, hvor bredt billedet renderes, så den kan vælge den mindste tilstrækkelige kilde.
fetchpriority="high", loading="eager", og overvej en preload.loading="lazy", så det ikke hentes, før der er brug for det.Behold altid width/height for at forhindre CLS.
En langsom LCP er oftest bare et overdimensioneret hero-billede. At kende formater (AVIF/WebP), srcset for den rigtige opløsning og korrekt priority — plus at ikke lazy-loade LCP-billedet — er det praktiske værktøjssæt, interviewere forventer, og det er som regel den enkelt-ændring med størst effekt på et rigtigt website.
Et bibliotek af IT-interviewspørgsmål med detaljerede svar — fra Junior til Senior.
Donér