【试验有效】使用quicklink加速你的WordPress网站

谷歌开源quicklink：可大幅提升网页加载速度，quicklink可以在空闲时预加载viewport内的链接，加速后续页面加载。

配置方法：

使用 wp_enqueue_script() 注册quicklink js。需要在 WordPress主题 functions中插入：

/**
* quicklink
* https://github.com/GoogleChromeLabs/quicklink.
*/
wp_enqueue_script( 'quicklink', 'https://cdnjs.cloudflare.com/ajax/libs/quicklink/2.0.0-alpha/quicklink.umd.js', array(), null, true );

在主题的页面底部(一般是footer.php)body结束标签前面加入js：

<script src="https://cdnjs.cloudflare.com/ajax/libs/quicklink/2.0.0-alpha/quicklink.umd.js"></script>
<script>
window.addEventListener('load', () => {
  quicklink.listen();
});
</script>
<script>quicklink();</script>

关于quicklink：

据介绍，quicklink旨在成为根据用户viewport中的链接预取内容的简易解决方案，并保持很小的体积（压缩后小于1KB）。GitHub页面上的说明显示，quicklink加速后续页面加载速度的原理如下：

• 检测viewport中的链接（使用Intersection Observer）
• 等待浏览器空闲（使用requestIdleCallback）
• 检查用户的连接速度（使用navigator.connection.effectiveType）或者是否启用了data-saver（使用navigator.connection.saveData）；
• 预取链接（使用或XHR），可以控制请求优先级（如果支持，可以切换到fetch()）。

若你对此感兴趣，可点此前往GitHub进行了解。