Would it be a reasonable convention within an Angular-2 project to always use
changeDetection: ChangeDetectionStrategy.OnPush
within a component's decorator? Except when there are clear reasons to use the default-strategy?
No, I wouldn't recommend that.
Angular 2 change detection is very fast. If you have a small project, I wouldn't bother using it.
If you have a large project, I would likely only use OnPush
on certain "leaf" components -- leaf components that have view bindings that only depend on input properties. (A "leaf" component has no child components.)
Beware that OnPush
can prevent child components from being automatically change detected, because if nothing caused the OnPush
component to be change detected, none of its children will be checked either. Hence the reason I normally only use it on leaf components, to avoid this possible issue.
Also beware that if you use JavaScript reference types for input properties, OnPush
will not detect changes you make to the properties of those reference types (e.g., if you add or remove an element from an array, or if you modify an object property's value.)
Especially for big project, the answer is YES
and it is always recommended to add it as first thing when you create new components.
The reason is simple: to decrease the change detection process that it is a very expensive operation.
There are many ways of starting the detection when needed, maybe the most used is to trigger manually changeDetection()
from the ChangeDetectorRef
. Another way is using the async
pipe in the view if you are waiting for a subscription value.
To add automatically the OnPush
strategy when running the ng generate component
command in the terminal, you just need to add the option in your angular.json
at the schematics
node:
...
"schematics": {
"@schematics/angular:component": {
"changeDetection": "OnPush",
"prefix": "app",
"styleext": "scss"
},
"@schematics/angular:directive": {
"prefix": "app"
}
}
...
No.
Why? not because the default change detection strategy is better. But because switching from it to OnPush can be cumbersome and impactful. You might also face few issues if you are using any 3rd party applications that do not use OnPush.
I just don't get it why a lot of people are joining the default change detection strategy bandwagon and are recommending it. In my opinion angular should have always had only one option - OnPush. This is not something new. Silverlight/WPF do this via INotifyPropertyChanged
public string UserName
{
get { return this.username; }
set
{
this.username = value;
// tell the UI that this UI bound property has been changed and that it is time to update the UI
PropertyChanged(this, new PropertyChangedEventArgs("UserName"));
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With