2016-05-27 11 views
0

私たちが今構築しているアプリはひどく遅いので、この質問をしていますが、狂ったことはしません!Angular2のエミュレートカプセル化はパフォーマンスに影響しますか?

単純なマルチステップフォームで、20フィールドと言うことができます。 アプリは極端に遅く、特にスクロールでは視覚的に遅れを見ることができます。 すべてのコンポーネントは個別仕様とカスタム仕様ですので、サードパーティライブラリは使用していません。

すべてのコンポーネントをカプセル化するようにしました:ViewEncapsulation.None、これは問題を修正したとは100%言えませんが、間違いなく少し滑らかにしました。

いい経験がありますか?

答えて

1

最初にパフォーマンスを調査する場合は、prodModeが有効になっていることを確認してください。 devModeでは、変更検知は常に2ターン実行されます。

ViewEncapsulation.Emulated(デフォルト)は、スタイルが解析されて書き換えられると、パフォーマンスに一度だけ影響します。このビルドステップはすぐに提供されるので、Angularアプリケーションがクライアントに提供される前に静的に行われます。

ViewEncapsulation.Nativeは、ページ全体ではなく単一のコンポーネントに再レンダリングを制限できる場合に、ブラウザが再レンダリングをより最適化することができるため、パフォーマンスが向上します。ブラウザがこの種の最適化を実際に行っているという保証はありません。しかし、シャドウピアスセレクタ/deep/>>>)と::shadowがシャドーDOM仕様から削除されたのは、これが主な理由でした。

も参照してください。Is shadow DOM fast like Virtual DOM in React.js?

関連する問題