当前位置:首页>建站教程>一个预加载网站,提升网站速度的 JS

一个预加载网站,提升网站速度的 JS

提示:本文最后更新于2026-05-14 10:42:22,某些文章具有时效性,若有错误或网盘夫效,请在下方留言或联系站长

简介

instant.page 是一个超轻量级的 JS 脚本,用来给网页增加“预加载”功能。它的原理很简单:当用户把鼠标悬停在一个链接上时,它会在后台偷偷预加载目标页面,这样用户真正点击时就能更快打开。

大致意思应该是:

  • 桌面端:在用户单击链接之前,他们将鼠标悬停在该链接上。当用户悬停了 65 毫秒时,有一次机会在两个链接上单击,因此此时 instant.page 开始预加载,平均留下超过 300 毫秒的页面来预加载。 您还可以在悬停上预加载,或在链接可见后立即预加载,并在用户开始按下鼠标时触发单击,使您的页面成为世界上最快的页面。
  • 移动端:用户在发布显示屏之前开始触摸其显示屏,平均留出90 毫秒用于预加载页面。另一种选择是一旦链接可见,就立即预加载它们。

使用方法

1.使用官方脚本

只要把这行代码添加到网站的 标签之前即可。(由于脚本托管在国外,只建议国外的朋友使用,国内的朋友加载官方的资源会比较慢哦)

<script src="//instant.page/5.2.0" type="module" integrity="sha384-jnZyxPjiipYXnSU0ygqeac2q7CVYMbh84q0uHVRRxEtvFPiQYbXWUorga2aqZJ0z"></script>

2.自托管文件 (推荐)

只需将下面下载地址里的 js 文件 上传到自己服务器,然后在 标签之前根据路径添加下面的代码即可(强烈建议服务器在国内的朋友使用)

<script src="`存放路径`/instantpage.js" type="module"></script>

3.公共 CDN 资源 (推荐)

只要把这行代码添加到网站的 标签之前即可。(由于文件全球 CDN,所以强烈建议使用,节省服务器资源) (速度自测)

<script src="https://cdn.jsdelivr.net/gh/instantpage/instant.page@master/instantpage.js" type="module"></script>
<script src="https://cdn.jsdelivr.net/npm/instant.page@5.1.0/instantpage.js" type="module"></script>
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

给TA打赏
共{{data.count}}人
人已打赏
建站教程

CentOS 服务器上用 Docker 部署 Cloudreve 网盘系统

2026-5-14 10:40:20

建站教程网站优化

WP-Cron 优化指南:提升 WordPress 性能,减少服务器负担

2026-5-14 10:48:32

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索