web-dev-qa-db-ja.com

AngularJSの双方向データバインディングがアンチパターンであるのはなぜですか?

AngularJSは双方向のデータバインディングを提供します。

私はいくつかのAngularJSアプリを構築し、双方向のデータバインディングが強力な機能であることを発見し、私の生産性を向上させました。

しかし最近では、双方向のデータバインディングはアンチパターンであると主張する投稿や記事が増えています。

例:

ほとんどのリソースは、React/Fluxによって促進されているような「単方向データフロー」を支持することを主張しています。

また、Angular2 発表済み 双方向バインディングがないことをしばらくの間...しかし、最新のドキュメントは、実際に提供されていることを示しています ngModelによる双方向データバインディング (プロパティおよびイベントバインディングの上に実装)

ただし、AngularJSでの双方向データバインディングに関連する問題はまだ完全には理解していません。

他のクライアントテクノロジー(つまり、swing、Eclipse-rcp、winforms、wpfなど)も双方向のデータバインディングを提供します。これがアンチパターンであるという主張に遭遇したことはありません...

AngularJSでの双方向データバインディングから生じる可能性のある問題を簡単に説明する標準的な例はありますか?

ビデオ 上記のリンクは、$scope.watchが問題であることを示唆しているようです...しかし、$scope.watchで公開されている関数にバインドすることにより、$scopeなしでサンプルを実装できます。
$scopeを使用しない場合(つまり、controller asを使用する場合)、双方向のデータバインドで残っている問題は何ですか?

21
jbandi

実際、双方向データバインディングの主な問題はパフォーマンスです。

AngularJSがリリースされたとき(1)、この機能は、フレームワークが開発者によって多く使用された主な理由でした。

コード行がなくても、モデル側またはビュー側からその値を変更することで要素を完全に動的にすることができ、値はモデルが設定されているすべての場所で変更されます。

この機能で最も重要なツールはウォッチングであり、双方向データバインディングに関するすべての問題を表しています。

アプリケーションが進化するにつれて、ウォッチャーとウォッチされる要素の数が増えます。
また、しばらくすると、アプリケーションはウォッチャーの大きなスープになる可能性があります。
これにより、アプリケーションは常に要素を監視し、反対側の要素を最新の状態に保ち、ブラウザから多くのリソースを消費します。

これが私の推奨事項です:ウォッチャーをできるだけ避けます。
これらは、コントローラーで本当に必要になることはほとんどありません。

また見なさい:

より明確になってほしいと思います。

10
chalasr

双方向のデータバインディングはそれ自体の問題になる可能性があります。モデルは、別のモデルを更新できるモデルを更新できるビューを更新できます...単方向データフローはより予測可能です。