quicklink

编程之家收集整理的这个编程导航主要介绍了quicklink编程之家,现在分享给大家,也给大家做个参考。

quicklink

quicklink 介绍

quicklink是一个js库,通过在空闲时间预先获取viewport内的链接,加快后续页面加载速度,可以预加载出现在视口的网页链接,提高用户体验。它的加载过程如下:

1.检测网页中的链接是否出现在视口中,等待链接出现在视口,执行步骤2。

2.等待浏览器空闲后执行3。

3.判断当前的网络连接是否是2G,如果是则停止执行,如果不是2G网络,执行步骤4。

4.预加载链接指向资源。  

quicklink旨在成为根据用户viewport中的链接预取内容的简易解决方案,并保持很小的体积(压缩后小于1KB)。 quicklink加速后续页面加载速度的原理如下:

检测viewport中的链接(使用Intersection Observer)

等待浏览器空闲(使用requestIdleCallback)

检查用户的连接速度(使用navigator.connection.effectiveType)

或者是否启用了data-saver(使用navigator.connection.saveData);

预取链接(使用<link rel=prefetch>或XHR),可以控制请求优先级(如果支持,可以切换到fetch())。

GitHub:https://github.com/GoogleChromeLabs/quicklink

网站描述:用于加快后续页面加载速度

quicklink官方网站

官方网站:

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

相关文章

johnny-five,Bocoup 的 JavaScript 机器和物联网编程框架
WePY,一款让小程序支持组件化开发的框架
Deep playground,神经网络的交互式可视化,使用d3.js和TypeS...
ShareDB,用于并发编辑系统的前端数据库
RxJS,RxJS 是使用 Observables 的响应式编程的库
egg-react-ssr,最小而美的Egg + React + SSR 服务端渲染应用...