100kの画像の表示方法は？

Question

私はリモートディレクトリでソートした10-100kの画像をスクロールできる効率的なJavaScriptライブラリまたはWebアプリケーションを探しています。

普通のHTMLタグとimgタグを使ってみると、ブラウザはメモリ不足からクラッシュします。

Answer 1

レイジーローディング画像を試してみますか？ http://luis-almeida.github.io/unveil/

イメージは、ユーザーがスクロールするまでロードされません。

Answer 2

Tillレイヤーを作成し、地図のようにトラフをナビゲートすることで、多くの部分で分割できます。 http://leafletjs.com/

Answer 3

偽のスクロール手法を実装し、その時に少数の画像のみを読み込む必要があります。遅延読み込みのように、スクロールすると古い画像が削除され、上下左右に怠惰な読み込みが行われます。

また、LinkedIn Engineering Blogのようなトリックでimgタグメモリを解放する必要があります。

UIWebView/Mobile Safariでは画像に厳しい制限があります。私たちのストリームは大きな画像でいっぱいです。 1つの選択肢は、HTML5 Canvas要素を使用してメモリ問題に遭遇することなく画像を描画することでした。しかし、キャンバス上で非常に大きな画像を描くのが遅いことがわかったので、別のアプローチをとる必要がありました。画像を十分にスワイプするたびに、imgタグの「src」属性を非常に小さな画像に置き換えました。これにより、大きなイメージのレンダリングに使用されるメモリが定期的に解放されました。また、空のイメージsrc属性バグを導入していないことを確認しました。