web-dev-qa-db-ja.com

大量のajaxで返されたオブジェクトをキャッシュする

他のアプリケーションAPIを介してajaxリクエストで大量のアイテムをフェッチするアプリケーションを構築しています。さまざまなアプリケーションビュー(ソート、フィルタリングなど)で複数回使用される6k-30k jsオブジェクトを返します。このような大きなリストに対してAPIを毎回クエリすることは避けたいので、このデータを何らかの方法でキャッシュすることにしました。

私はさまざまな解決策について考えていました:

  • ローカルストレージに保存し、
  • いくつかのキャッシュライブラリ(locachejsなど)の使用
  • js varに格納します。

私はエキスパートではないので、各(または1つの)ソリューションについて、その長所と短所についてのあなたの提案を聞きたいです。

すべての助けをいただければ幸いです。

3
lukaszkups

残念ながら、ここでの「正しい」答えは、それらのオブジェクトのサイズ(複雑さ)に依存します。

経験から、最も一般的な複雑さのオブジェクトの25.000〜50.000は、ブラウザを使いやすさの制限内で動作させる制限であることがわかりました。

ここには、私のものと一致するいくつかの有用な結果があり、サンプルオブジェクトを自分のオブジェクトと比較できます。

http://www.ziggytech.net/technology/web-development/how-big-is-too-big-for-json/

これを念頭に置いて、このデータをキャッシュすることは、次の点を考慮した実行可能なアプローチになる可能性があります。

  • 後でアプリの応答性が向上することで、最大4MBのデータの読み込みを待つことは正当化されますか?

  • localstorageは5MBに制限されています

待機が正当化される場合は、次のいずれかをお勧めします。

  • キーでデータの一部にアクセスして直接使用する必要がある場合は、データを変数に保存します(メモリ消費はそれほど悪くありません)。

  • indexedDBを使用します。データをクエリする必要がある場合、その構造はより複雑であるか、クライアント側でさまざまな方法で操作する必要があります。これはやや複雑なアプローチですが、ライブラリが役立ちます( https:/ /github.com/aaronpowell/db.js よく対応してくれました)

がんばって!

3
Leo