Javascript + HTML：如何有效顯示大量圖像？

Question

一些背景信息：我正在開發一個chrome擴展程序，它將使用大量（可能是數千個）圖像網址。 列表中將包含許多圖片類型的網址。

我想讓用戶能夠通過查看實際圖像而不是僅查看URL來瀏覽這些圖像。 現在，我只是遍歷列表，對於每個URL，我都會將元素附加到可滾動元素。 這導致圖像的可滾動列表。 一些是gif，一些png，一些jpeg等。我擔心，如果列表很大，將會有很多滯后，並且該過程將占用大量帶寬。

有沒有一種有效的方法來有效地執行此類操作（即減少延遲和加載時間）？

理想情況下，我將為每個網址設置一個縮略圖。

Answer 1

顯然，成千上萬的圖像不會一次顯示在一個視圖中，而是像您所描述的那樣在長列表中顯示。 我要采取的方法是緩沖圖像並在滾動顯示它們。 這將需要您計算一行中可以存儲多少圖像，並且在當前滾動位置的前后至少緩沖兩三行。 這種方法的唯一缺點是，如果縮略圖行很大，要獲得平滑的滾動解決方案可能會很棘手。