使用instant.page为网站加速

 使用instantpage.js对网页进行预加载

介绍

instant.page是一个开源项目，它会在用户点击url之前将网页加载好以加快页面的显示速度

优点

纯js实现，使用简单

仅预加载HTML页面节省服务器带宽

缺点

会导致访问量统计不准确

仅加载HTML如果页面引用了外部资源效果会差一些

使用方法

手动插入

前往<b>instant.page的GitHub项目页面https://github.com/instantpage/instant.page</b>下载instantpage.js到网站的根目录.

将以下内容插入到网站footer模板的底部:

<script src="/instantpage.js" type="module"></script>

网站模板一般在主题目录内，动态博客一般为footer.php，静态博客一般为footer.html

CloudFlare应用程序自动添加

适用于使用了CloudFlare CDN的网站. 打开Instant Page app页面https://www.cloudflare.com/apps/instant-page-app，点击Preview，然后点击左下角的Finish installing onto your site即可.

作为用户

上面说的方法都是针对服务提供者的，作为网站用户自然也希望网页加载快速一点，那么可以使用instant.page官方提供Chrome浏览器插件FasterChrome:

https://chrome.google.com/webstore/detail/fasterchrome/nmgpnfccjfjhdenioncabecepjcmdnjg

检查效果

打开浏览器的开发者工具(F12)，点击网络

将鼠标指针移动到页面内的链接上，会发现浏览器正在后台加载鼠标指针指向的页面.

--------------------------------------------------

Make your site’s pages instant in 1 minute and improve your conversion rate by 1%

https://instant.page/

instant.page

Make your site’s pages instant in 1 minute and improve your conversion rate by 1%.

ℹ️ Info is on the website.

📜 The source is in instantpage.js.

🌟 Star this repository to follow its development.

Tests

With Node, run:

node test/app.js

And access http://127.0.0.1:8000/. Or specify another port with an argument after the filename.

Minifying

To minify instantpage.js into instantpage.min.js install uglify-es globally (npm i uglify-es -g) then run npm run minify.

from instantpage/instant.page: Make your site’s pages instant in 1 minute and improve your conversion rate by 1% (github.com)