InstantClick 网站提速神器
2016-11-20 本文已影响0人
yundGo
前几天偶然在封尘的博客上遇到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;
}