本文最后更新于 540 天前,其中的信息可能已经有所发展或是发生改变。
引言
如果你觉得你网站页面的跳转比较慢,或者说你想变得更快,那么这么脚本我想会比较适合你。
项目
Github:https://github.com/instantpage/instant.page
官网:instant.page
原理:预加载用户想访问的页面,用户点击网站链接之前会将鼠标悬停在该链接上,当用户鼠标在超链接附件徘徊 65 ms 时就开始预加载目标网页到缓存,当用户真正点击链接时,浏览器就会直接读取缓存以此提升网站的访问速度。instant.page 是渐进式增强 ,对不支持它的浏览器没有影响。
使用方法
在网站的<body>
添加一行 JS 代码,一般添加在<footer>
区域。instant.page 的 JS 的有以下几种添加方法。
官方提供的方法(不推荐)
虽然有 Cloudflare CDN 的加速,但对于国内而言……抗打是的确抗打,但这速度……一言难尽。
<script src="//instant.page/5.1.1" type="module" integrity="sha384-MWfCL6g1OTGsbSwfuMHc8+8J2u71/LA8dzlIN3ycajckxuZZmF+DNjdm7O6H3PSq"></script>
下载后放到自己网站目录下
下载地址:Github Repo | GitHub Raw | HiCDN GH Raw
<script src="/instantpage.js" type="module"></script>
懒人 Ctrl C + Ctrl V
自己复制然后贴进去
<script src="https://raw.hichina.tk/instantpage/instant.page/master/instantpage.js" type="module"></script>
也是使用了 Cloudflare CDN,速度比官方的 instant.page
快不了多少,但总比 raw.githubusercontent.com
被墙了好些。
2023 年 6 月 12 日更新:使用亚太 CDN 加速,比 Cloudflare 速度更快。
分析
优点
- 很明显地提升加载速度。
- 只会预先加载 Html,不会加载图片之类的,不用担心损耗大量流量。
缺点
- 只对站内连接有效果,比如说
subdomain1.example.com
(不存在)使用后只能加速subdomain1.example.com
(不存在)无法加速subdomain2.example.com
(不存在)或subdomain1.example.org
(不存在) - 因为每次预加载都算访问成功,所以网站的 PV 数会指数增长。
- 如果全站使用 CDN 加速,使用该脚本会大大增加请求数,所以不建议该类网站使用。
结语
总的来说,是一个不错的脚本,对于提升页面加载速度有很大帮助。