替博客添加预加载(InstantClick)

2017-10-17T21:26:00

看到有些博客上点击后直接秒开,很是疑惑.我的为啥不能。然后找教程着手修改,之后...

灰常兴奋,我找到了就是InstantClick ,但是首先一点.添加此功能会加大服务器的负担。

实现原理
InstantClink使用pushState和Ajax(Pjax)来实现,只替换了body和头部title,浏览器不需要重新解析编译页面,这样在页面跳转的过程中,浏览器不会闪一下白屏,看上去页面在瞬间加载完成。

下面的是我直接引用 CDN 的js ,这样能提高点速度,国外的建议GitHub,或者自己把代码下载加入主题中。

代码

<script src="https://cdn.bootcss.com/instantclick/3.0.1/instantclick.js" data-no-instant></script>

<script data-no-instant>InstantClick.init();</script>

<script src="https://cdn.bootcss.com/instantclick/3.0.1/instantclick.min.js"></script>

注意:如果是Typecho 需要把上面的代码放到footer.php文件去,添加到之前

如下

<script src="https://cdn.bootcss.com/instantclick/3.0.1/instantclick.js" data-no-instant></script>
<script data-no-instant>InstantClick.init();</script>
<script src="https://cdn.bootcss.com/instantclick/3.0.1/instantclick.min.js"></script>
</body>
</html>

示例一样添加即可。

还是一点哈,上面那个是我自己使用的,其实可以查看InstantClick文档,还能设置预加载时间,进度条等等.自行解决还是不错滴,有时间写个插件能服务大众,嘎嘎...



也顺便加了个文章访问统计,插件直接是上Google上搜索的,插入进去.完成... 详细请看文章右上角.MJJ

当前页面是本站的「Baidu MIP」版。发表评论请点击:完整版 »