Overview
Unlike prefetching, which is for future needs, preloading is for the current page. It is used for high-priority resources that the browser might not discover until late in the rendering process, such as fonts, critical CSS, or key images.
Usage
<link rel="preload" href="font.woff2" as="font" type="font/woff2" crossorigin>
Benefits
- Reduces the time to render the page.
- Prevents 'Flash of Unstyled Text' (FOUT) by loading fonts earlier.
- Ensures critical assets are available when needed.