使用InstantClick预加载页面,并兼容Meting插件

今天了解到InstantClick预加载的效果,觉得可以用在自律小栈博客上加快速度,当然在工作驿站上就不使用了,因为本来速度就不慢,再加上驿站自带一个动态载入效果,使用InstantClick预加载也改变不了进度,除非关闭这个动态效果。

闲话不多说,先看看如何使用InstantClick加快博客速度吧。

InstantClick使用预加载技术,默认鼠标在悬浮于链接的时候,就开始预加载链接,这也是属于pjax的一种。

使用方法很简单,直接下载js文件,然后在footer中靠近页尾位置引用即可:

...
<script src="instantclick.min.js" data-no-instant></script>
<script data-no-instant>InstantClick.init();</script>
</body>
</html>

这样InstantClick已在您的网站上激活,可以打开网页查看效果了。

使用InstantClick之后,自律小栈中的音乐播放使用Aplayer并不会自动重载,网上找了一圈,找到了解决办法。

将原先代码中的<script data-no-instant>InstantClick.init();</script>替换成下面的代码即可:

   <script data-no-instant>
        InstantClick.on('change', function(isInitialLoad) {
        if (isInitialLoad === false) {
        loadMeting();
        }
        });
        InstantClick.init();
   </script>

这样就可以完美享受InstantClick带来的加速效果了,如果你的博客还有其他插件或功能,可能会存在一些问题,需要自己动手解决。

参考:
InstantClick文档
Yodu模板