Angular change detection: why is the whole tree checked for local changes?

Question

Let's say I have a simple array of texts:

textContent = [
    {text: 'good morning'},
    {text: 'lovely day'},
    {text: 'for debugging'},
  ]

I present a simple component for each, passing in a text element as input:

<app-text *ngFor="let text of textContent" [text]="text"></app-text>

The text component displays text using ngModel:

<textarea [(ngModel)]="text.text"></textarea>

I also enter DoCheck:

ngDoCheck() {
    console.log(this.text.text, ' has been checked')
}

When I enter something into one textarea, all other components of DoCheck are fired.

good morning   has been checked
lovely days    has been checked
for debuggings has been checked

This happens even when OnPush is used to detect changes.

Question . Why do changes made to the data of one component launch the whole tree that needs to be checked?

(This is not a problem with multiple components, but with a large tree I drop frames).

, "doCheck".

, - ?

Answer 1

, :

DoCheck(), , . , Angular , .

, ngDoCheck , - , .

Answer 2

Angular . , . , , .

, Angular , , , , . . , , .

, Angular , .

, , , - .

Pascal Precht , .

, , , , onPush, , . , onPush.