Bringing instant page-loads to the browser through speculative prerendering
Resource hints, such as preconnect, preload, prefetch, and prerender, help the browser figure out which resources will the user need in the near future.
preconnect and preload are declarative hints—the browser must act on them, so use them when you are sure that a resource will be required during the next load.
prefetch and prerender are speculative hints—use these to recommend that the browser should fetch a certain resource because there's a high chance it might be required.
This article focuses on speculative prefetching and prerendering. Learn more about how they're used, the drawbacks of the current implementations, and popular external libraries that implement sophisticated speculation. Enhancements that bring same-origin speculative prerendering to the browser are under developed and you can learn more about their design and participate in Chrome origin trial.
Users looking at a list of links relevant to their interest (for example, a list of products or articles matching a search keyword or the user's preferences) will likely click on the links at the top. If they navigate back to the list page, they might click the following link in the list. prefetch and prerender rely on this knowledge of the user's behavior. Developers speculate which page (B) is likely to be requested after a specific page (A).
