11. Resource Prefetching
What is prefetch?
Prefetching is a way to give the browser hints about resources that may be used in the future. When a resource is prefetched, the browser stores the content of the resource in a local cache, and once the user requests the resource, it is served from the browser cache, thus speeding up the loading and rendering of the page.
We mentioned a pre-fetching method (called preloading) earlier when discussing font loading optimization.
Prefetching can be used to:
Perform a DNS lookup
The entire page
JavaScript files
CSS Files
Any media files (fonts, audio, video, images, etc.)
There are a number of different ways to prefetch resources. Here is ecuador mobile database a brief overview of the differences between them:
Preresolve performs a DNS lookup for the next page
Preconnect is similar to above, but it also performs a TCP handshake and optional TLS negotiation.
Prefetch also performs requests, which is useful for images and other files. For example, we can instruct the browser to load a certain image in advance on the current page.
Prerender Prerendering allows you to load a document and all the resources found in the document. Not to be confused with prerender.io , which is a completely different type of prerendering!