prefetch

SKILL.md

Prefetch

Prefetch (<link rel="prefetch">) is a browser optimization which allows us to fetch resources that may be needed for subsequent routes or pages before they are needed. Prefetching can be achieved in a few ways. It can be done declaratively in HTML (such as in the example below), via a HTTP Header (Link: </js/chat-widget.js>; rel=prefetch), Service Workers or via more custom means such as through Webpack.

When to Use

Use this when you know users will likely navigate to certain routes or need certain resources soon

This is helpful for reducing perceived loading time on subsequent navigations

When NOT to Use

For resources unlikely to be needed — unnecessary prefetching wastes bandwidth and competes with critical requests

On low-bandwidth or metered connections where prefetching consumes the user's data budget

When the prefetched resources change frequently and would be stale by the time they're used

Instructions