[mat-stepper] Consider detaching inactive steps from Angular change detection

[earshinov]

Angular's ChangeDetectorRef provides detach and reattach methods that allow to temporarily disable change detection on the given component.

Have you considered using it in mat-stepper? In case two or more steps use shared data, there is no point wasting CPU cycles for updating components on inactive steps. (Of course, these components will need to be updated eventually, when the user visits the corresponding steps, but it is still much better than updating them all the time.)

I have prepared a demo project:
https://stackblitz.com/edit/mat-stepper-change-detection-demo

Scenario:

1. focus the number field
2. hold the Up Arrow key for a few seconds
3. note the lags and high CPU usage while the Up Arrow key is held

It happens because the contents of the second step keep updating on every change in the number field. (On the demo page the issue is exacerbated by the fact that initialization of every new Quill component takes significant amount of time).

4. press the [Detach] button to detach the second step from change detection
5. note that the number field now works smootly.

[Splaktar]

This is related to #12817. We could consider closing this one in favor of #12817 as that has more activity.

[canserkanuren]

Hi,
Any updates on this feature ?
Thanks.