Kort fortalt: Priority Hints handler om at påvirke browserens prioritering af netværksrequests. I praksis bruger du det ofte via fetchpriority (fx på LCP-billedet), men det er vigtigt at forstå hvad det kan – og hvad det ikke kan.
Hvad betyder det i praksis?
Browseren prioriterer altid ressourcer:
- HTML først
- kritisk CSS højt (ofte render-blocking)
- scripts afhænger af
defer/async - billeder afhænger af placering, størrelse og heuristik
Problemet er: browserens heuristik kan tage fejl i din konkrete skabelon. Priority hints er en måde at give browseren et ekstra signal.
Hvorfor er det vigtigt for LCP?
LCP afhænger ofte af ét stort element:
- et hero-billede
- en stor tekstblok (hvor CSS/fonts og render delay kan dominere)
Hvis LCP-elementet er et billede, kan fetchpriority="high" og/eller Preload være det der gør at download starter tidligt nok.
Men: hvis LCP-elementet er tekst, hjælper det typisk mere at reducere render-blocking og rendering-arbejde (se render-blocking og Critical CSS).
Hvad fetchpriority kan og ikke kan
Det kan:
- øge eller sænke prioriteten på en request som browseren allerede kender til
- ændre konkurrencen mellem flere downloads på samme netværk
Det kan ikke:
- få en ressource “opdaget” hvis den først kommer sent i HTML/JS
- kompensere for langsom TTFB eller tung rendering
- erstatte caching og gode headers
Typiske fejl
1) Sæt “high” på alt
Hvis alt er high, er intet high. Du kan også skade andre kritiske ressourcer, fx CSS eller scripts der er nødvendige for første paint.
2) Preload + fetchpriority uden at måle
Det kan give dobbelt-downloads (hvis du preloader forkert) eller bare flytte flaskehalsen. Brug Waterfall-analyse og DevTools.
3) Prioritér forkert billede
På mange sites er LCP-billedet ikke “det største i markup”, men det der ender med at blive størst i viewport. Hvis du prioriterer et forkert billede (fx logo), spilder du budget.
Sådan vælger du det rigtige (hurtig metode)
- Find LCP-elementet i Lighthouse/PSI.
- Se i waterfall hvornår request starter.
- Hvis den starter sent, så spørger du:
- blev den opdaget sent? (HTML/JS/
srcset) - eller var den lav prioritet?
- blev den opdaget sent? (HTML/JS/
- Brug derefter:
fetchpriority="high"hvis opdagelsen er tidlig men prioriteten er lavpreloadhvis opdagelsen er for sen (med omtanke)
Relaterede begreber
- fetchpriority – dit konkrete værktøj i markup
- Preload – start download tidligt
- HTTP prioritet – browserens netværksprioritering mere generelt
- LCP – hvad du reelt prøver at forbedre
FAQ
Er Priority Hints det samme som preload?
Nej. `preload` starter en specifik download tidligt. Priority Hints påvirker prioriteten på en request, men den request skal stadig blive opdaget først. De kan kombineres, men det er ikke det samme.
Skal jeg sætte fetchpriority=high på alle billeder?
Nej. Det udvander effekten og kan stjæle båndbredde fra det vigtigste. Brug det typisk kun på et reelt LCP-billede eller et meget tidligt kritisk asset.
Eksterne kilder
Specifikationer og praktiske referencer for resource priority og fetchpriority.
Næste skridt fra begreb til handling
Guides og blogindlæg der matcher begrebets emne - ud fra fælles tags og sidens fokus.
Gør hero til LCP: sådan ændrer du struktur, CSS og prioritering
Hvis LCP bliver en tilfældig paragraf i stedet for hero, får du både dårligere tal og en måling der ikke matcher brugerens første indtryk. Her er en konkret metode til at få hero (H1/billede) til at blive LCP – uden at snyde.
Brug fetchpriority og preload rigtigt på de vigtigste ressourcer
Få en praktisk guide til hvordan du bruger fetchpriority og preload på billeder, fonts og CSS uden at overstyre browseren forkert.
Fjern render blocking CSS og JavaScript for hurtigere første visning
Lær hvordan du reducerer render blocking fra CSS og JavaScript, så siden viser indhold hurtigere og giver bedre FCP og LCP.
Hvordan du spotter render delay (uden at stirre på score)
Render delay er ofte grunden til at LCP bliver 1–2 sekunder for sent, selv når TTFB ser fin ud. Her er metoden til at finde årsagen hurtigt – og vælge den rigtige type fix.
Fetchpriority, preload og preconnect: hvornår de hjælper og hvornår de gør skade
Lær hvornår fetchpriority, preload og preconnect faktisk forbedrer load, og hvornår de bare skaber mere støj og dårlig prioritering i browseren.
5 grunde til at din hjemmeside er langsom og hvad du gør ved det
Se de mest almindelige årsager til en langsom hjemmeside, hvordan du spotter dem, og hvilke ændringer der typisk giver mest effekt først.