Preload

Preload is a resource hint implemented via <link rel="preload"> that instructs the browser to fetch a specified asset as early as possible in the page lifecycle, before it would normally be discovered during parsing. Unlike prefetch, which loads resources for future navigations at low priority, preload operates at high priority for the current page. It is most commonly used to preload the LCP image, critical web fonts, and late-discovered CSS or JavaScript needed for initial rendering. The as attribute is required and must match the resource type (image, font, script, style, etc.) so the browser applies the correct fetch priority and Content Security Policy rules. Google’s PageSpeed Insights and Lighthouse both recommend preloading the LCP image as a high-impact optimisation. Overusing preload can backfire by competing for bandwidth with other critical resources, so it should be applied selectively to assets that are genuinely on the critical rendering path and not already discovered early by the browser’s preload scanner.