### [一个预加载网站，提升网站速度的 JS](https://www.huiui.net/article/117)

**Published:** 2026-08-25T06:50:45

**Author:** 小新.

**Excerpt:** 一个预加载网站，提升网站速度的 JS

## **简介**

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

**大致意思应该是：**

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

## **使用方法**

### **1.使用官方脚本**

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

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

### **2.自托管文件 (推荐)**

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

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

**3.公共 CDN 资源 (推荐)**

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

```javascript
<script src="https://cdn.jsdelivr.net/gh/instantpage/instant.page@master/instantpage.js" type="module"></script>
```

```javascript
<script src="https://cdn.jsdelivr.net/npm/instant.page@5.1.0/instantpage.js" type="module"></script>
```

**Categories:** 网站优化

**Comments:** 

**DoKi.:** 我试过了，效果很好，推荐给其他朋友。

**哆啦A梦的时光机:** 这个预加载脚本真的挺不错的，可以大大提高网站访问速度。



---