懒加载：渐进式 vs 按需

Question

懒加载：渐进式 vs 按需

javascriptjquerylazy-loading

64

这是一个概念性问题。在我的情况下，我正在使用slick.js为网站创建图像轮播。由于这些是高分辨率照片，我希望通过允许异步加载照片而不是在页面加载时来加快页面加载时间。

在查看此库的文档时，我看到了“lazyLoad”属性的可用设置，但很少有关于这些设置在实践中意味着什么的信息。

本质上，我的问题是，在懒加载的上下文中，渐进式和按需之间有什么区别。

- Caleb Faruki

2个回答

13

值得一提的是，在源代码中还有另一个lazyLoad选项的值，尽管没有记录在文档中：'anticipated'。它是在版本1.7.1中引入的。 lazyLoad接受'ondemand'、'progressive'或'anticipated'三种懒加载技术。 'ondemand'会在你滑动到图片时立即加载该图片。 'progressive'会在页面加载时依次加载每张图片。 'anticipated'会预加载1个上一个和1个下一个图片。

- Baras

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Reeno · Accepted Answer

渐进式：在页面显示时加载可见的图片，其他图片在后台加载完成后再进行逐步加载 ("在初始化时加载可见幻灯片，然后在 window.load() 时逐步加载其余的幻灯片。")。如果页面中其他图片大多数（或全部）都会被使用，则应使用此选项。 按需加载：在页面显示时加载可见的图片，其他图片只有在它们被展示时才加载。("[...] 按需加载幻灯片。当滑块变为可见 (或在滑块之前回调函数上) 时, 进行加载。")。如果轮播图中的其他图片非常少显示，则应使用此选项。

来源：https://github.com/kenwheeler/slick/issues/35，尤其是来自 4 月 5 日的 jasonday 的评论。