教程-使用js腳本預加載爲網站提高訪問速度

原文鏈接:https://520526.xyz/1196/

這是一個很簡單很玄學的js腳本,可以讓你的網站加載更快,根據我目前的測試效果來看確實比較理想,原理就是通過捕捉鼠標懸浮的鏈接進行 預加載
。腳本的加速指站內加速,但只會預加載html頁面,不會加載圖片等資源,所以完全不用擔心與流量損耗等問題。

預加載

資源預加載是另一個性能優化技術,我們可以使用該技術來預先告知瀏覽器某些資源可能在將來會被使用到。預加載簡單來說就是將所有所需的資源提前請求加載到本地,這樣後面在需要用到時就直接從緩存取資源。

官網鏈接https://instant.page/
GitHubhttps://github.com/instantpage/instant.page

調用方法

在/body 前添加:

<script src="//instant.page/1.2.2" type="module" integrity="sha384-2xV8M5griQmzyiY3CDqh1dn4z3llDVqZDqzjzcY+jCBCk/a5fXJmuZ/40JJAPeoU"></script>

WordPress調用方法,把 js 文件 instantpage.js 上傳到主題的 JS 目錄下,然後在主題 footer.php 中 /body 前添加即可:

<script src="<?php echo get_template_directory_uri(); ?>/js/instantpage.js" type="module" integrity="sha384-2xV8M5griQmzyiY3CDqh1dn4z3llDVqZDqzjzcY+jCBCk/a5fXJmuZ/40JJAPeoU"></script>

使用此腳本後我發現統計數據不對了,因爲預加載會被統計成正常瀏覽次數,也算是個 BUG 吧,對於強迫症來說,這不能忍!!!

然後就找到了另一個腳本:InstantClick
官網地址:instantclick.io
GitHub地址:https://github.com/dieulot/instantclick/

這個腳本通過鼠標的click來預加載,效果雖然略弱於instant.page,但統計總算正常了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章