简介

instant.page 是一个 JS 库，当用户鼠标悬停在链接上面，就开始预加载网页，从而使得用户真正点击的时候，页面瞬间就能加载完成。

原理

instant.page 利用了 预加载技术，当用户有意向访问某个页面之前，浏览器首先对此页面进行预加载，当用户真正点击链接后，会从预加载的缓存中直接读取页面内容，缩短页面的加载时间。
当用户鼠标放在页面上某个链接上时，该脚本会在页面头部添加一行代码

<link rel="prefetch" href="链接地址">

有了上面的link标记，浏览器就会提前加载这个网址。

注意由于仅仅是提前获取资源，因此浏览器不会对资源进行预处理，并且像 CSS 样式表、JavaScript 脚本这样的资源是不会自动执行并应用于当前文档的。

使用

<script src="//instant.page/5.1.0" type="module" integrity="sha384-by67kQnR+pyfy8yWP4kPO12fHKRLHZPfEsiSXR8u2IKcTdxD805MGUXBzVPnkLHw"></script>

只需要复制这行代码添加到你的网站上即可。注意：将此HTML片段放在</body >标签之前。

对于国内网站最好下载该脚本托管到自己网站上或国内cdn上，这样速度更快。
脚本可以去GitHub上下载，下载地址：
https://raw.githubusercontent.com/instantpage/instant.page/master/instantpage.js

参考资料

• https://instant.page/
• https://www.muouseo.com/article/z64y9l6y5l.html