Javascript + HTML:如何有效地显示大量图像?

时间:2013-09-07 17:40:33

标签: javascript jquery html image google-chrome-extension

某些背景: 我正在制作一个Chrome扩展程序,它将使用大型列表(可能是数千个)图像网址。该列表将包含许多图像类型的URL。

我希望用户能够通过查看实际图像来浏览这些图像,而不仅仅是查看网址。现在我只是遍历列表,对于每个url,我将一个元素附加到一个可滚动元素。这导致可滚动的图像列表。有些是GIF,有些是png,有些是jpeg等。我担心如果列表变得非常大,会有很多延迟,并且这个过程将占用大量带宽。

是否有一种很好的方法可以有效地做这样的事情(即减少延迟和加载时间)?

理想情况下,每个网址都有一个缩略图。

1 个答案:

答案 0 :(得分:0)

显然,在一个视图中不会同时显示数千张图像,但正如您所描述的那样,在一个长列表中。我将采取的方法是缓冲图像并在滚动时显示它们。这将要求您计算可以连续存储的图像数量,并且在当前滚动位置的前后至少缓冲两行或三行。这种方法的唯一缺点是,在缩略图行很大的情况下获得平滑的滚动解决方案可能很棘手。