Angularのコンポーネントスタイルカプセル化にパフォーマンス上の利点はありますか？

私はAngular 2のstyle encapsulationメソッドについて、スタイルをコンポーネントに直接書くことができる方法について読んできました。Angularのコンポーネントスタイルカプセル化にパフォーマンス上の利点はありますか？

このメソッドは、ネイティブのシャドウドームまたはエミュレートされたドミノを使用できます。コンポーネント固有のスタイルのいずれかを使用することによるパフォーマンス上の利点は何ですか？

出典

2017-01-11 BenRacicot

エミュレートすると、パフォーマンス上の利点はありません。これは、スタイルを自動的に特定のコンポーネントにスコープするスタイルカプセル化です。

は、スタイルの書き換えがビルド時に行われているIBMアカデミーで

をエミュレートし、それ以外の場合は、分析し、スタイルを書き換えるため、実行時にかなりの時間を要します。

スタイルは、<head>要素に追加されます。いくつかの状況では、ブラウザが必要な再レンダリングいくつかは、それ以外の全ページを再レンダリングする原因となるコンポーネントにローカルであることを知ることができるので、

ネイティブシャドウDOM

は、いくつかのパフォーマンス上の利点があります。私は具体的な例を知らない。

出典

2017-01-11 15:44:24

素晴らしい！今、私たちはどこかに行っています...いくつかの悪ふざけのように質問を閉じるために投票するのではなく...デベロッパーベースの利点がスタイルをカプセル化するのが見ていますが、文書では表現されていないパフォーマンス上の利点は、最もメリットの高い方法のワークフロー。 – BenRacicot

エミュレーションはパフォーマンス上の利点を提供せず、テーマストーリーが弱すぎるためにネイティブはあまり使用されません。 AngularはCSS変数をサポートしておらず、これらもIMHOが限られています。また、perfのメリットはAngularに固有のものではなく、DOMをシャドーするものです。すべてのブラウザのドキュメントをAngularで繰り返すのは意味がありません。 –

これは残念ですが、エミュレートされたスタイルのカプセル化にはパフォーマンス上の問題があります。事は、Angularは属性を使用してCSSルールを適用することです。また、それらの使用は効率的ではありません。特にEdgeの現在のバージョンでは効率的ではありません。

ここでは、いくつかのベンチマークを証明として見ることができます。 https://medium.com/@andreygoncharov/edge-hates-you-attributes-d15faf162939

大規模なプロジェクトを開発する際には、おそらく2017年に角型のカプセル化を使わないでください。

issueのステータスを確認できます。

出典

2017-10-02 16:01:21

Angularのコンポーネントスタイルカプセル化にパフォーマンス上の利点はありますか？

答えて

関連する問題