preload relationship
tl;dr: Use <link rel="preload" href="/assets/atkinson-hyperlegible-regular-102a.woff2" />
to tell the browser it needs to schedule the asset to be downloaded and cached with higher priority.
<link
rel="preload"
href="/assets/atkinson-hyperlegible-regular-102a.woff2"
as="font"
type="font/woff2"
crossorigin="anonymous"
/>
This approach can also be used with as="fetch"
to precache API requests, or anything that’s on the critical path when it comes to rendering performance.
Use this carefully as it’ll increase load on your backend; so, anything that gets preloaded please ensure it’s actually used to render content to the user.