javascript - 1000以上の未分類の画像サムネイルをモバイルブラウザに表示する必要がありますが、方法がわかりません

Question

モバイルでテストするとき、私が試みるすべては不十分です。読み込み時間が許容できないほど長く、スクロールがぎくしゃくしているなど。私が使用しているサムネイルの幅は120ピクセルです。これは具体的な質問ではないことは承知していますが、このような問題にどのように取り組みますか？

Answer 1

私は3つのアプローチを考えることができます

1. 古典的な方法：ページ付けを使用し、10/20/50のみを表示します。1ページあたりのサムネイル
2. 最新の（複雑な）方法：ユーザーがスクロールしているときに画像を追加し、画像が表示領域を離れるときにDOMから画像を削除します（最もよく知られている例：Google画像検索）
3. 不器用な方法：サーバー上で画像をつなぎ合わせ、たとえば3x5の親指のクラスターとして機能させます

Answer 2

すべてのサムネイルを一度に読み込まないようにすることをお勧めします。ページが最初に読み込まれるときに50個または100個のサムネイルを読み込むことができ、さらに読み込むをクリックすると残りのサムネイルを読み込むことができます。または、ページに整理することもできます

一度にロードすると、WebページのサイズがMBを超え、ロードにかなりの時間がかかることは明らかです。