パフォーマンス向上のためのVaadin 7コンポーネントの遅延ロード

私のVaadin 7アプリケーションでは、重い視点があります。サーバー側は非常に速く動作します。私のinit（）メソッドのすべてのロジックは100〜150msですが、ブラウザでのレンダリングには多くの時間がかかります（コンポーネントの数によって異なります）。今、Google Chromeでこのビューを表示するには10秒です。パフォーマンス向上のためのVaadin 7コンポーネントの遅延ロード

私はこのビューのパフォーマンスを最適化する方法を探しています。私はLazyLoadWrapperを見つけましたが、少し古くなっています。

ユーザーエクスペリエンスとビューレンダリングのパフォーマンスを向上させるために、Vaadin 7.6のこのコンポーネントに似ていますか？

これは、このパフォーマンスの問題を再現できるデモプロジェクトVaadin Demo Projectある

を更新しました。ソースとVaadinのテーマをコンパイルするために、プロジェクトフォルダから

mvn clean install

：ください、単純な実行のMavenコマンドこのアプリケーションを起動するために

。その後、

とcom.techbook.ui.Applicationクラス（このクラスはmainメソッドが含まれている）と、アプリケーションを実行するには、組み込みのTomcat 8に開始し、次のURLにアクセスしてくださいされます。

http://127.0.0.1:8080/vaadin-ui/#!decisions/123/Name

com.techbook.ui.view.decision.DecisionViewを - と図であり、前述のパフォーマンスの問題。

出典

2016-07-30 alexanoid

ビューは、どのコンポーネントが含まれていますか？そして何人ですか？私の経験では、Vaadinは特にいくつかの（ネストされた）レイアウトでは多くのコンポーネントを持つように設計されていません。コンポーネント/レイアウトの数を減らしてみてください。 –

質問にスクリーンショットを追加しました。ご覧のとおり、入れ子になったコンポーネントを持つGridStackがいくつかあります。私はメインのGridStackで80個の要素を処理する必要がありますが、この場合、私のビューは〜15-20秒程度ロードされます...今、私はいくつかの遅延ロードを導入することを考えています – alexanoid

要素の半分レンダリングされる。ブラウザの時間はそれから短縮されますか？私はどのようにコンポーネントの怠惰なロードを実装することができます（あなたが述べたアドオンを除いて）考えていない。 –

この「ヘビービュー」のカスタムレイアウトは、おそらく単純なhtlmテンプレートと組み合わせて使用することをお勧めします。アプリケーションが高速化する別の可能性は、特定のレイアウトの組み合わせを置き換えることです。例えば。 VerticalLayoutとHorizontalLayoutの組み合わせの代わりにGridLayoutを使用します。 UIガイドラインで許可されている場合は、NativeSelectまたはComboBoxの代わりにAutoCompleteTextFieldまたはSuggestFieldアドオンを使用してください。私は私の提案のいくつかはあなたを助けることを願ってい

、

フロリアン

出典

2016-08-02 07:52:14 Florian

あなたの答えをありがとう。縦横レイアウトをCssLayoutに置き換えましたが、それは役に立ちません。私はこのパフォーマンスの問題を取り除くために、必要に応じて自分のソースを共有することができます。 – alexanoid

質問にドームプロジェクトを追加しました – alexanoid

パフォーマンス向上のためのVaadin 7コンポーネントの遅延ロード

答えて

関連する問題