推奨されるJavaScriptオブジェクトの配列サイズ

Question

ビルド中のページにはアイテムのリストが表示されます。例として、これらが販売用の製品であるとしましょう。 1つの項目には、短いタイトル（50〜200文字）、価格、およびその他の簡単な情報が含まれます。通常、カテゴリごとに200個のアイテムがあります。しかし、ほとんどの場合、1000個と5000個のアイテムがあります（ごくまれに）。

私は、オブジェクトのJavaScript配列にすべてのアイテムをプリロードして、ページネーションをスムーズにし、プロダクトフィルタを作成することを考えていました。ユーザーがフィルタまたはページ番号を選択したことに基づいて、DOMは表示するために結果を簡単に再描画します。これは私が確信している200項目のためにうまくいくでしょう。しかし、5000はどうですか？非常に多くのアイテムをループするとブラウザが遅くなりますか？

すべてを一度事前に読み込んで項目を動的に表示するか（サーバーに別の呼び出しを行わないでください）、ユーザー選択ごとにサーバーからデータを読み込むのにまだ最適な方法ですか？ありがとう。

Answer 1

私は心配する必要はないと思います。あなたの唯一の心配は、（ユーザーのブラウザに）行を介してデータを取得することです。 5000 × 200 = 1000000バイトですので、1MBを少し上回ります。

JavaScriptのパフォーマンスはおそらく問題ありません。私のテスト（Chrome 16の適度に古いラップトップ）では、1msだけで5000個のモックオブジェクトを作成し、それらの繰り返しを繰り返し、説明を連結して価格を追加しました。見てみよう：http://jsfiddle.net/PPvG/G3UDH/

クライアントとサーバーの間の接続が高帯域幅であり、待ち時間が長い場合は、帯域幅ごとに、すべてを前面に読み込む方が良いでしょう。接続の帯域幅が狭くレイテンシが短い場合は、部分的に読み込むとユーザーエクスペリエンスが向上する可能性があります。だから、どちらのアプローチが状況によりますか。