2011-12-27 7 views
0

ユーザーが文字を入力できるテキストボックスがあり、提案ボックスが開きます。 私はキーアップイベントでイベントを発生させました。タイマーが設定され、その後に非同期呼び出しが発生し、非同期呼び出しが成功すると、提案リストがロードされます。 問題は、文字の入力を開始すると、ブラウザの読み込みシンボルが表示され、非同期呼び出しが正常に返って候補が表示されるまで、テキストボックスに文字を入力できなくなることです。 要点は、呼び出しがasyncの場合、ブラウザがUIでイベントをブロックする理由です。GWT非同期呼び出しUIをブロックする

以下はコードです。 fireイベントは、非同期呼び出しを呼び出して、終了イベントイベントメッセージを出力します。したがって、非同期呼び出しはブロックされません。 ます。public void showSuggestions(最終文字列のクエリ){

ArrayList<PCTSuggestion> list; 
    System.out.println("Show Suggestions"); 
    if (query.length() > 0) { 
     GWT.log(query); 
     list = cacher.getCachedvalues(query); 
     //list = new ArrayList<PCTSuggestion>(); 
     if(list != null) { 
      if(!isTabOut() || !isBlurred()) { 
       display.showSuggestions(PCTSuggestBox.this, list, true, isAutoSelectEnabled(), suggestionCallback); 
      } else { 
       display.hideSuggestions(); 
      } 
     } else { 

      this.fireEvent(new NewSuggestionEvent(query, limit));  
      System.out.println("End of Fire Event"); 

     } 
     //display.showSuggestions(PCTSuggestBox.this, null, true, isAutoSelectEnabled(), suggestionCallback); 
    } else { 
     display.hideSuggestions(); 
    } 
} 
+1

おそらく、イベントハンドラで非同期呼び出しの完了をブロックしていますか?実際のコードの一部を共有できますか? – bobbymcr

答えて

1

それが起こっている理由千理由が考えられます。 AsyncCallbacksはあまりにも非同期ではありません。実際のHTTPリクエストが送信されたときにのみ、UIスレッドをブロックしません。しかし、リクエストの構築、レスポンスの解析、コールバック本体の処理は、通常どおりUIスレッドで行われます。可能な犯人:

  • データのクレイジー量がネットワーク
  • 受信したデータの一部無効処理
  • DEVMODEでChromeを使用しての提案
  • の無効レンダリングを介して送信される(クロームはDEVMODEと非常に遅いです)

コードのどの部分が遅いかを実際に測定するのが簡単になるため、ここでは他の996の理由を書き留めません。

+0

私はまた、主な理由が開発モードであると確信しています。 –

0

テキストボックスのような入力のすべてのキーストロークに対して非同期呼び出しを行わないようにします。

Google検索のおすすめの形式で表示されるものは、GWTではありません。

私が提案したようにタイプを実装したい場合は、GWTで正しく実装する方法がわかりません。私はjavascriptでアプリを書く必要があります。提案型のサービスは別個の隠された分離されたフレーム/ iframeにあります。キーアップハンドラは、そのフレームと通信します。そのようにして、私は(私が正しいとは限りません)、テキストボックスが非同期通信と衝突しないと感じます。

おそらく、Googleのjavascriptクロージャツールhttp://code.google.com/closure/を考慮する必要があります。

GWTを使用すると、サーバーベースの偶数バスを経由することなく、別のフレームに置かれた別のGWTアプリケーションに対処することはほとんど不可能になります。

調整している親フレームが必要です。お互いの参照や通信が必要な2つ以上のフレームが、その親フレームの子である必要があります。

しかし、あなたはJavaScriptで書くことができます。 javacriptで書いてみると、GWTのすべての紐と袖口から解放されます。

おそらく、そのサービスをJSNI呼び出しにラップすることができるので、レイアウトにGWTを使用し続けることができます。私が見ている問題は、JSNIによって呼び出された外部Javascriptに対して、あなたのテキストボックスをどのように見えるようにするのでしょうか?おそらく、テキストボックスにIDを与えることによって?しかし、ちょっと待って、GWTはIDをウィジェットに伝えたくありません。それには確実なデバッグIDを割り当てることができますが、実動コードで実行可能です。

あなたのテキストボックスには、uibinderでHTML要素を使用できます。また、uibinderでは、HTML要素にIDを割り当てることができます。しかし、あなたはDOMを介して入力テキストボックスの値を読み取る必要があります。私はこの方法でGWT/javascriptをミックスしようとしたことは一度もありません。

+1

全く同意しない。 Suggest-as-you-typeはGWTで完全に機能します。しかし、著者とは違って、標準のGWT APIを使っていました。 –

+0

Alexeyが提案したように、GWTの 'SuggestBox'を使うと、すべてがすでに完了しています。 –