Skip to content

Commit 2298b82

Browse files
author
ying.liu
committed
add angular change detection strategy
1 parent 330277e commit 2298b82

File tree

1 file changed

+6
-0
lines changed

1 file changed

+6
-0
lines changed

frontend/angular-best-practices.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,12 @@ Simply, follow the following rules:
1414
- Use `ngDestroy()` to clear resources such as unsubscribing from observables.
1515
- Use asynchronous methods to update properties and know the `NgZone` concept to avoid the `ExpressionChangedAfterItHasBeenCheckedError` error.
1616

17+
## Change Detection Strategy
18+
19+
It is recommended to use the `ChangeDetectionStrategy.OnPush` strategy for better performance. Correspondingly, use `@Input` with immutable objects and the `async` pipe in components.
20+
21+
The default change detection strategy `ChangeDetectionStrategy.Default`runs change detection for all possible operations, thus it is not efficient in many cases. When use `ChangeDetectionStrategy.OnPush` change detection strategy, Angular runs change detection only in two cases: 1) The `@Input` reference changes (the `===` comparison changes), and 2) A DOM event such as a button click originated from the component or one of its children. It ignores all timers, promises and HTTP events. An exception is that when you use the `async` pipe to display data from asynchrounous operations like HTTP requests or promises, the `async` pipe marks the component to be checked by calling the `ChangeDetectorRef.markForCheck()` method.
22+
1723
## Forms
1824

1925
Only use the reactive Form, not Template Form. Template forms are asynchornous and event-driven. They are also not as flexible as reactive forms.

0 commit comments

Comments
 (0)