Make ChangeDetectorRef#detach() work with most child components

🚀 feature request

Relevant Package

@angular/core

Description

Detaching views is (sometimes) absolutely necessary for good performance.

<item *ngFor="let item of longList" [value]="item"></item>

Whenever a single item is invalidated (even for a mousemove event), Angular has to check every single item. Unless of course they are detached.

But…detach() is practically unusable because it’s very, very poorly supported.

Angular Material is perhaps the best-made Angular library and even it breaks if detaching any parent. Example: https://stackblitz.com/edit/angular-nvcgil (expandable area will not expand)

Describe the solution you’d like

When I detach from change detection, what I really want is to not to dirty the parent, not to change how the children operate.

In other words, I want to make the component a “root” for change detection.

AFAIK there is no mechanism to do that currently.

Describe alternatives you’ve considered

• Not detaching. The causes poor performance.
• Fixed libraries for detached change detection. But I’m 100% certain the Angular team will refuse my PRs to Angular Material.
• Not using libraries.

It’s unfortunate having to choose between using libraries and having performance.

[pkozlowski-opensource]

I’m going to keep this issue open as this is one of the reports that highlights possible improvements in our change detection system.

[pauldraper]

Yes, you understand correctly.

This is a feature request for a detach() that is actually usable.

Right now, almost nothing the ecosystem supports it, and it seems impossible (except earlier hack mucking with View), to make them work with it.