3

GXT を使用してかなり複雑なシステムに取り組んでいます。FF ではすべてがうまく機能しますが、IE (特に IE6) では話が異なります (ブラウザーがページをレンダリングするまでに 10 秒以上かかります)。

主な理由の 1 つは、IE6 での惨事である DOM 操作であることを理解しています ( http://www.quirksmode.org/dom/innerhtml.htmlを参照)。

これは、フロントエンド Javascript フレームワーク (すなわち GWT) の一般的な問題であると考えることができますが、同じ機能を実行する単純なコード (以下を参照) は、別の方法で証明します。実際、IE6 では、getSomeGWT() に 400 ミリ秒、getSomeGXT() に 4 秒かかります。これは、ユーザー エクスペリエンスに大きな違いをもたらす x10 ファクターです !!!

private HorizontalPanel getSomeGWT() {
        HorizontalPanel pointsLogoPanel = new HorizontalPanel();
        for (int i=0; i<350; i++) {
            HorizontalPanel innerContainer = new HorizontalPanel();
            innerContainer.add(new Label("some GWT text"));
            pointsLogoPanel.add(innerContainer);
        }
        return pointsLogoPanel;
    }

    private LayoutContainer getSomeGXT() {
        LayoutContainer pointsLogoPanel = new LayoutContainer();
        pointsLogoPanel.setLayoutOnChange(true);
        for (int i=0; i<350; i++) {
            LayoutContainer innerContainer = new LayoutContainer();
            innerContainer.add(new Text("just some text"));
            pointsLogoPanel.add(innerContainer);
        }
        return pointsLogoPanel;
    }

したがって、問題を解決/軽減するには、次のことを行う必要があります- DOM 操作の数を減らします。またはb。それらを innerHTML に置き換えます。

私の知る限り、(a) は単に GXT を使用した場合の副作用であり、(b) GXT でまだサポートされていない UiBinder でのみ可能です。

何か案は？

前もって感謝します！

4

2 に答える 2

0

私はそれが何か関係があると思います：

pointsLogoPanel.setLayoutOnChange(true);

これにより、追加のコンポーネントごとにレイアウトの呼び出しが強制され、表示されている違いが生じる可能性があります。

于 2011-05-25T12:39:05.983 に答える
-1

GXT レイアウト コンテナーはより強力ですが、コストがかかります。特に RowLayout などのレイアウトを使用する場合は非常に強力です。

私の最初の質問は、これらのネストされたコンテナーにどのような機能が必要ですか? 動的サイズ、高度なサイズ変更オプション/プロポーション? それとも、GWT コンテナーまたはプレーンな HTML コンテナーで十分でしょうか?

GXT Layout Containers を使用する場合は、layoutOnChange オプションを無効にすることから始めてください。そのオプションを有効にすると、コンテナに子を追加するたびに追加の処理が発生し、その時点でブラウザが再レンダリングされる可能性があります。

したがって、layoutOnChange を無効にして、for ループの後に pointsLogoPanel で layout() を呼び出すだけです。ただし、まだ親コンテナーに追加していないため、pointsLogoPanel が追加されたら、親コンテナーで単に layout() を呼び出すことができます。これですべてのパフォーマンスの問題が解決するわけではありませんが、おそらく大いに役立つでしょう。

于 2012-07-04T23:11:09.987 に答える