web-dev-qa-db-ja.com

入力時の検索時のキーストロークの遅延

Windowsアプリにインスタント検索を導入しています。最初の実装では、ユーザーがキーを入力すると、検索エンジンがクエリを実行して結果を返します。ユーザーが長いWordを検索するときに各文字がクエリを実行するため、検索を少し遅らせて、ユーザーが完全なWordを書き始める前に書き込むことができるようにしたので、それはあまり効率的ではないと思いましたクエリを実行し、結果をテーブルにロードします。行がリロードされるときの効率が向上し、グリッチが減少します。

とにかくこれは良い習慣ですか?それについて何か慣習はありますか?ミリ秒単位の遅延のケーススタディを探していますが、何も見つかりませんでした。短いもので、ユーザーがゆっくりタイプすると、アプリケーションは多くのクエリを作成します。長いと、ユーザーはアプリケーションがデータのロードが遅いと感じます。

31
dbalboa

はい、これは素晴らしい練習です。キーを押すたびに実際に検索を実行すると、遅延が発生する可能性があるため、アプリケーションの応答性を向上させることもできます。

私は、基本的に2つの時間を設定するコンポーネント(これと同様の目的のために至る所で使用しています)を構築しました:追加の入力を待つ最小時間と、最初の入力からアクションの実行を開始する最大時間。最小タイマーは入力を編集するたびにリセットされ、最大時間はアクション(この場合は検索)がトリガーされたときにのみリセットされます。これにより、説明した状況を回避できます。私が構築したアプリケーションでのこのセットアップへの応答は非常に良好でした。

理想的なタイミングは正確なユースケースと対象者に依存すると思いますが、最小待機時間は0.1秒、最大待機時間は0.8秒の範囲の値を使用しています。

17
André

特にオートコンプリートについての調査はありませんが、ユーザーインターフェイスの知覚可能な遅延は 100ミリ秒 と考えられています。その時点で、ユーザーは自分がコントロールしていると感じ、インターフェイスは応答性があります。

それを念頭に置いて、考慮すべきいくつかの要因があります。

  • 低速のインターネット接続/低速のコンピューターでクエリがどれだけ早く返りますか?
  • データの配信をどのように最適化していますか?圧縮されていますか? JSON? HTML?
  • 返されたデータを解凍するには、どのくらいの処理能力が必要ですか?
  • 複数のユーザーが参加している場合、データベース/サーバーはいくつの同時接続を処理できますか?
  • データベースにアクセスすることなくデータをキャッシュできますか?
  • 結果は十分に有限であり、ページ上に保存される可能性さえありますか?

一般に、少なくとも2文字が入力されるまでルックアップを遅らせ、ルックアップを非同期リクエストにし、DBヒットを回避するために一般的なクエリをキャッシュし、JSON形式を使用して圧縮します。そして、Mervinが述べたように、何らかの理由で遅延がある場合は、読み込みアイコンを使用して、何かが発生していることをユーザーに通知します。 2文字の制限を超えて意図的にルックアップの遅延を試したことはありませんが、100ミリ秒を超えるラウンドトリップは「感触テスト」に合格しないと思います。

更新:質問をもう一度読んだところ、WebアプリではなくWindowsアプリであることがわかりませんでした。ただし、ほとんどのアドバイスは引き続き適用されます。

14
Virtuosi Media

キーストロークの表示を遅らせることの背後にある論理を理解しているとは思いません。キーストロークはユーザーが実行する主要なアクションであり(結果の検索結果は二次的なものです)、ユーザーは自分が実行した主要なアクションに即座に応答することを期待します。応答の遅れは彼を混乱させるだけです。

ただし、検索結果の表示の遅延に関しては、次のいずれかの方法を使用することをお勧めします。

  • あなたの応答は即時である必要はありません。 Jquery Token Input (オートコンプリートプラグイン自体が300ミリ秒の遅延を推奨しています)。したがって、短い遅延はユーザーを苛立たせません。ただし、検索結果が取得されていることをユーザーに知らせる進行状況インジケーターを表示することをお勧めします。これを引用するには スマッシング誌の記事

結果はすぐに表示されるのが理想的ですが、システムのフィードバックには進行状況インジケーター(検索中…)を使用する必要があります。 Fidelity(下)は、結果が最終的に表示される場所を表示します。

enter image description here

  • あなたの課題の1つは、各キャラクターが追加される多くの結果の範囲があることです。そのため、ユーザーが結果を範囲指定できるようにすることをお勧めします。そうすれば、結果は探しているものに固有であり、あなたも送信します。クエリの数が少なくなります。これがGoogleとphotobucketの例です

モバイルアプリのUIパターン:検索、並べ替え、フィルター

モバイルWeb用の設計:特別な考慮事項

5
Mervin

実際にケーススタディについては知りませんが、Webアプリケーションで「インスタント検索」を行ったときに行ったこととその理由を以下に示します。

いくつかの文字が入力された後、クエリを自動的に開始することはありません。私の意見では、これに対して非常に手間がかかり、面倒です。代わりに、ユーザーがEnterキーを押したときにのみクエリを送信します。

Enterキーを押して送信できることを知らない人のために、検索ボックス内に小さな検索アイコン(虫眼鏡)を追加しました。クリックすると送信されます。経験の浅いユーザーの中には、常に「送信する」ボタンをクリックして検索するものがあり、見つからない場合は少し混乱するかもしれません。

2
koko

入力フィールドをユーザーに適応させることができます。つまり、ユーザーが最初の数文字を入力すると、ユーザーがどれだけ速くそれを行ったかを測定します。ユーザーが入力を続けると、最初の速度(要求の完了または少なくとも一時停止を示す)に比べて速度が低下するまで待機し、インスタント検索要求を送信します。これにより、高速タイパーと低速タイパーの両方に最高のエクスペリエンスを提供できます。

2
Pasha

遅延の主な問題は、遅延が環境(この場合はユーザーの違い)に適応しないことです。

それが私がルールを持っている理由です"時間遅延を使用して何かを制御することは常に間違っています。"

この場合の最も適切な解決策は、すべてのキーストロークで要求を行うことです。

リクエストが十分に速くない場合-つまり、1秒あたり20..50のリクエストが保証されることを意味します非同期方法でリクエストを整理する必要があります-別のスレッドでリクエストを返し、リクエストが返されたときに提案ウィンドウを更新します、ユーザーが同時に入力できるようにします。このように、遅延は自動的に導入され、事前定義された定数ではなく環境に依存します。

このような状況での一般的なトリックの1つは、クエリの最初の一致のみを要求し、ユーザーが提案ウィンドウをスクロールした場合にのみ残りを要求することです。

マッチングアルゴリズムが十分であれば、ユーザーはほとんどの場合、最初の提案の1つを選択します。

1
johnfound