私はISO3166-2に従ってユーザーの領域を入力する必要がある入力フィールドを持つwebappを持っています。ユーザーエクスペリエンスを向上させるために、このフィールドをオートコンプリートにしたいと考えています。ユーザーは入力を開始し、提案を受け取ります。また、満たされれば、選択された国の地域に示唆する地域の量を制限する国のフィールドもあります。大規模な配列でオートコンプリート候補を効率的に検索する
リージョンリストは、世界で公式に認められたすべての国の地域名とコードを含む非常に大量のデータで、フットプリントは約250KBです。
似たような経験を持っている方は、次のような方法で実装することをお勧めしますが、その理由は何ですか？
1）地域リストをクライアントに送信せず、ユーザーが地域フィールドに入力するたびにサーバーにリクエストします（デバウンスを行う）。サーバー側の提案を探すが、追加のラウンドトリップがある;
2）ウェブワーカーを使用しておすすめを探す。
3）smth else？
リージョン名（または多少似ている）としてキーを持つ連想配列を持つことができます。その後、ロジックに従ってバックエンドから配列を取り込むことができます。
あなた自身でアレイを維持するためのコードを書く必要があります。
また、プリフェッチ、インテリジェントなキャッシング、高速検索、リモートデータによるバックフィルを持つBloodhoundを使って、Twitterの先読みなどの方法で時間を節約できます。
はここのリンクです：https://github.com/twitter/typeahead.js
通常の 'Array.prototype.find'よりもパフォーマンスが優れていますか？ –
Array.prototype.findはECMAScript 2015で追加され、一部のブラウザでは利用できない場合があります。ただし、MDNによって提供されるポリフィルを見ると、線形検索が行われますが、バイナリ検索は高速です。 また、検索技術については、このリンクをご覧ください。http://www.andygup.net/fastestway-to-find-an-item-in-a-javascript-array/ – arnabkaycee
大きなデータセットの場合、それは、AJAXを介してデータを取得するには良いでしょう、役立つかもしれないjQueryライブラリがあります。 https://github.com/devbridge/jQuery-Autocomplete –
@KhorshedAlamありがとう！私は反応を使用しているので、jqueryプラグインは探していませんが、一般的に興味があります.Ajaxリクエストは、そのような次元のデータセットで本当に価値がありますか？ –
データをサーバーに保存するか、ダウンロードするかにかかわらず、検索ツリー（https://en.wikipedia.org/wiki/Search_tree）を使用して作成します。 –