Comment: Preloading is a browser mechanism that uses the browser's idle time to pre-download/load the pages/resources that users are likely to browse next. When the user accesses a pre-loaded link, if it hits from the cache, the page can be quickly rendered.
One of the ways in which browser manufacturers and developers work together is to make the website faster. There are many well-known acceleration solutions now: CSS sprites (CSS sprites, puzzles) and image optimization, distributed configuration files (.htaccess), JS/text file compression, CDN acceleration, etc.I covered in another blog post about how to make a website faster.
FireFox promotes a new website acceleration strategy: link preload. What is link preloading? MDN description is as follows:
Preloading is a browser mechanism that uses the browser's idle time to pre-download/load pages/resources that users are likely to browse next. The page is provided to the browser that needs to be preloaded. After the browser completes loading the current page, the page that needs to be preloaded will be downloaded in the background and added to the cache. When a user accesses a preloaded link, if hit from the cache, the page is rendered quickly.
Simple overview: The website allows the browser to download the specified page/document/picture based on user analysis, which is very easy to implement:
HTML5 preload tags
<!-- Page, you can use absolute or relative paths-->
<link href="page2.html" />
<!-- Pictures can also be other types of files-->
<link href="sprite.png" />
From the above HTML code, we can see that preloading uses the <link> tag and specify the rel=prefetch attribute, and the href attribute is the file path that needs to be preloaded. Mozilla also implements some similar link rel properties:
<link href="mozspecific.css" />
<link href="2.html" />
Note: The https protocol is also supported.
When is preloaded
Whether the website is preloaded depends on your needs, here are some suggestions:
- If a series of page slides are displayed like this, then 1 to 3 pages can be preloaded.
- Loading pictures that are common within the website
- Preload the next page on the search results page
Preloading
Firefox allows for prohibiting preload mode, the code is as follows:
user_pref("network.prefetch-next", false);
Things to note
Regarding link preloading, there are the following precautions:
- Preloading can be performed across domains, of course, cookies and other information will also be sent during request.
- Preloading can destroy website statistics without actually accessing the user.
- Mozilla Firefox is currently the only browser that supports preload mode (2003-2010)
What do you think? Downloading additional files using free time is an aggressive optimization