1

ユーザーが UI オートコンプリートを使用して場所を選択できるテキスト ボックスをアプリケーションに用意しました。約10,000 の有効な場所があり、ユーザーはその中から 1 つを選択する必要があります。オートコンプリート機能には 2 つの実装があります。

  1. ページが初めてロードされたときに場所のリストを取得し、配列を反復処理して、javascript のすべてのキーストロークで一致するアイテムを見つけます
  2. MySQL(使用されているデータベース)での検索がはるかに高速であるため、すべてのキーストロークでajaxリクエストを行いますか?

性能的には、どちらが優れていますか?

最初のテストでは、データを一度にロードする方がパフォーマンスの観点から優れたアプローチであることが示されています。ただし、このテストは、JavaScipt 処理が非常に高速な MBP で行われました。この手法が、ローエンドの Android 携帯や古いシステムなどの処理能力の低いマシンに適しているかどうかはわかりません。

4

2 に答える 2

1

あなたの質問は、ブラウザーで 10,000 行以上を処理するか、リモート サーバーにリクエストを送信して小さい結果セットを返すか、どちらが速いかを中心に展開しています。実行時のコンテキストと環境に依存する興味深い問題。リモート サーバーへの送信では、ほとんどの場合ネットワーク遅延が発生しますが、サーバー オーバーヘッドはわずかです。

したがって、パフォーマンス方程式には、クライアントの処理速度とネットワーク遅延の 2 つの変数があります。3 番目の変数であるデータ量もありますが、これは質問では一定の 10k です。

クライアント ブラウザとネットワークの両方が高速な場合は、好きな方を使用してください。

ネットワークがより高速な場合は、リモート サーバー アプローチを使用しますが、何千もの小さなリクエストでサーバーが過負荷にならないように注意してください。

クライアントの方が高速な場合は、おそらくローカル アプローチを使用します。（下記参照）

どちらも遅い場合は、おそらくどちらかを選択するか、これを最適化するために多くの時間と労力を費やす必要があります。

両方のクライアントの速度低下は簡単に発生する可能性があり、3G 上の私の電話ブラウザーはこのカテゴリに分類され、ランダムな Ajax 要求のネットワーク遅延は約 200 ミリ秒であり、一部の JavaScript のパフォーマンスも低下します。

ユーザーが認識するパフォーマンスが本当に重要であるため、各文字の最初の N 個の値を最初のページの読み込みで変数としてプリロードし、最初のキーストロークの結果にこれらを使用すると、数ミリ秒節約できます。

サーバー アプローチを使用する場合は、要求された結果と、次のキーストロークごとにいくつかの値をいつでも送信できます。これは、ユーザーが見るものと重なり、低速のネットワークでより鮮明に表示されます. 例えば

Client --> request 'ch'
Server responds with a few result for each potential next letter
    'cha' = ...
    'chb' = ...
    Etc

もちろん、これには、Ajax リクエストと、以前のリクエストからキャッシュされた結果を使用して選択内容を事前入力することを交互に行うための特殊な JavaScript が必要です。

ローカル クライアントで 10k レコードすべてを検索する場合は、サーバーがレコードをソートされた順序で返すことを確認してください。オートコンプリート スキャンで「含む」ではなく「で始まる」選択を使用できる場合 (たとえば、RO と入力すると Rotorua には一致しますが、Paeroa には一致しません)、http://en.wikipedia.org/wiki/を使用して処理時間を大幅に短縮できます。 Binary_search_algorithm の手法であり、この分野には SO の答えがたくさんあると確信しています。

于 2013-03-12T19:23:07.833 に答える
1

毎回バックエンドにクエリを実行する利点がない場合は、実行しないでください。

バックエンドに常にクエリを実行する利点は何ですか? 最初の呼び出しで返されるデータの量が多すぎる場合 (帯域幅、それを準備するための JavaScript の処理時間、まったく時間) は、毎回の部分的な要求がよりスマートなオプションになる可能性があります。

于 2013-03-12T14:19:00.023 に答える