Angular2のプロダクションモードと開発モードの違いは何ですか?


回答:


76

開発モードでは、変更検出は最初の実行の直後に2回目の実行を行い、1回目と2回目の実行の間にバインド値が変更された場合はエラーを生成します。これは、値のチェックに副作用があるか、フィールドまたは関数が、Angularの変更検出を損なう後続の呼び出しで同じ値を返さないバグを見つけるのに役立ちます。

開発モードでは、2回目の変更検出の実行中に、Angularは、許可されていないモデルの変更を検出するために本番環境では行わない深いオブジェクト比較もいくつか実行します。

更新:

開発モードでは、HTMLサニタイザーサービスがバインディング[innerHTML]="..."またはから値を削除すると、ヒントもコンソールに出力されます[ngStyle]="..."。参照:RC.1では、一部のスタイルはバインディング構文を使用して追加できません


5
プロダクションモードと開発モードのどちらで実行しているかをどのように検出しますか?

私はこれが既に尋ねられるのを見ましたが、私は答えを見ていません。プロダクションモードを明示的に有効にする必要があります。また、コードでチェックして、どのモードがアクティブであるかを確認できるprodModeを有効にするときに、いくつかのグローバル変数を設定することもできます。
ギュンターZöchbauer

6
また、開発モードで実行していて、ブラウザーでコンソールを開くと、「Angular 2は開発モードで実行しています。enableProdeMode()を呼び出して本番モードを有効にしてください」というメッセージが表示されます。すでにプロダクションモードになっている場合、ここには何も表示されません。
c.dunlap 2016

36

ApplicationRef.tick()状態のドキュメント:

開発モードでtick()は、2番目の変更検出サイクル(TTL = 2)も実行して、それ以上変更が検出されないようにします。この2番目のサイクル中に追加の変更が検出された場合、アプリのバインディングには副作用があり、1回の変更検出パスでは解決できません。この場合、Angularアプリケーションはすべての変更検出を完了する必要のある変更検出パスを1つしか持つことができないため、Angularはエラーをスローします。

追加の変更ができないのは、本番モードでは変更検出が1回しか実行されないためです。つまり、コンポーネントツリーのすべてのコンポーネントが1回(TTL = 1)検査されます...上から、深さ優先注文。したがって、たとえば、子コンポーネントの入力プロパティを変更すると、親コンポーネントがビュー/テンプレートでバインドした他のプロパティが変更された場合、親コンポーネントのビューは更新されません(変更の検出では、プロダクションモードの親コンポーネント...「1パス」ツリー走査のため)。次回イベントが発生して変更検出が再度実行されるときにのみ更新されますが、それでは遅すぎます!

ルールに違反するPlunker次のとおりです。子コンポーネントには、set別の入力プロパティを変更する入力プロパティのメソッドがあります。はい、これは不自然な例ですが、次の例よりも理解しやすくなっています。

この問題が発生する可能性があるもう1つのシナリオは、ステートフルパイプです。それがあなたの問題であるなら、この答えをチェックしてください。

あなたはあなたの問題を(別のSOの質問で)説明する必要があります。それを修正する方法があるはずです。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.