Ressourcehints er <link>-tags, der fortæller browseren at hente eller forbinde til ressourcer tidligt for at optimere indlæsningsydeevne. Hver enkelt opfylder et anderledes timing-/prioritetsbehov.
Ressourcehints er <link>-tags, der fortæller browseren at hente eller forbinde til ressourcer tidligt for at optimere indlæsningsydeevne. Hver enkelt opfylder et anderledes timing-/prioritetsbehov.
preload — "Jeg har brug for dette til den aktuelle side, hent det nu med høj prioritet." Til kritiske ressourcer, som parseren opdager sent: skrifttyper, hero-billeder, CSS-refererede assets. Kræver as så browseren sætter korrekt prioritet/headers.
preconnect — "Jeg forbinder til denne origin snart; foretag DNS-opslag + TCP + TLS-håndtryk nu." Sparer rundturen før den første anmodning til en tredjepart (API, skrifttypevært, CDN). Brug til få kritiske origins.
dns-prefetch — en lettere version af preconnect: kun DNS-opløsning. God fallback / til mange origins.
prefetch — "Jeg vil sandsynligvis have brug for dette til den næste navigation; hent det med lav prioritet når der er tomgang." Til sandsynligvis-næste sider/assets. Cachet til fremtiden, ikke den aktuelle side.
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="preload" href="/fonts/inter.woff2" as="font" type="font/woff2" crossorigin />
Skrifttyper opdages sent (browseren skal først parse CSS), så preloading af dem undgår usynlige-tekst-forsinkelser.
Preloading af alt underminerer formålet — det konkurrerer med virkelig kritiske ressourcer om båndbredde. Hint kun de få, der betyder mest.
Ressourcehints reducerer latency på den kritiske sti: preconnect fjerner håndtryksforsinkling for tredjeparter, preload prioriterer sent-opdagede kritiske assets (skrifttyper, LCP-billede), og prefetch gør den næste navigation føles øjeblikkelig.
Brugt strategisk forbedrer de betydeligt Core Web Vitals.
Et bibliotek af IT-interviewspørgsmål med detaljerede svar — fra Junior til Senior.
Donér