InstantClick 網站提速神器

前幾天偶然在封塵的博客上遇到InstantClick,網站提速神器。它賦予了頁面上每個超鏈接預加載的能力,除了新打開的窗口!鼠標移動到超鏈上,便會觸發!將dom預先加載到本地,從而達到快速打開網頁的目的。
用法很簡單,下面說下基本用法還有遇到的一些問題。
下載地址:http://instantclick.io/download
在需要引用instantclick的頁面引入js代碼

<script type="text/javascript" src= "js/instantclick.js" data-no-instant></script>
<script data-no-instant>InstantClick.init();</script>

這樣,默認的a標簽都會預加載!除了新打開的窗口!如果給a標簽添加 data-no-instant 屬性,那么這個超鏈接就不會預加載了,在一些特定的場景需要用到,比如說,instantclick 引起的一些CSS、插件加載失敗,無法修復的情況,可以讓鏈接到此頁面的超鏈接失去預加載能力。
我遇到的一個問題,多說評論插件有時候會加載失敗。這跟pjax局部刷新的問題一樣,而這種情況一般就是要重新載入插件了,看多說官網給出的教程 動態加載多說評論框 ,在頁面新增一個方法

function _loadDuodsuo(){
  var dus=$( ".ds-thread" );
  if($(dus).length==1){
    var el = document.createElement('div');
    el.setAttribute('data-thread-key',$(dus).attr("data-thread-key"));
    el.setAttribute('data-url',$(dus).attr("data-url"));
    DUOSHUO.EmbedThread(el);
    $(dus).html(el);
  }
}

然后在底部再調用一次即可解決該問題。
順便說下,頂部的進度條顏色也是可以修改的O(∩_∩)O~

#instantclick-bar {
  background: #fd8a61;
}
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,284評論 25 708
  • WebSocket-Swift Starscream的使用 WebSocket 是 HTML5 一種新的協議。它實...
    香橙柚子閱讀 24,110評論 8 183
  • 城市的發展速度,是樓房的高度 越來越高的高樓大廈 代替了溫馨的四合院,消失了城中村 拋棄了你的狗狗,它移民不成汪星...
    泰安左眼皮跳跳閱讀 265評論 0 8
  • 人們往把自己看得過重才會患得患失,不要以自己的眼光和認知去評論一個人,其實心有多大,快樂就有多少;包容越多,得到越多。
    湘子雅閱讀 155評論 0 0
  • 當南方的油菜花,早已結籽 收割榨油,上了主婦的餐桌 祁連山的油菜花啊 正盛開得一地金黃,如火如荼 在大...
    走過繁花似錦的世界閱讀 121評論 0 0