ion-router-outlet OnPush

[ionitron-bot]

Original issue by @Abrissirba on 2020-11-06T14:18:32Z

Documentation

Is there any documentation on why you should not use OnPush on components that use ion-router-outlet? It is mentioned here, https://ionicframework.com/docs/angular/lifecycle, but I would like to know about why.

Is it only the component that contains the that shouldn't have OnPush or does it also apply to components that are loaded into the ?

[averyrousseau]

Thank you for the issue. It looks like the docs have since been updated to include more details about this: https://ionicframework.com/docs/angular/lifecycle#angular-life-cycle-events I'm going to close this out, but please feel free to open a new issue if you're still having trouble.

[ms-emp]

Is it still relevant that we shouldn't use OnPush?

[jbgtmartin]

In https://ionicframework.com/docs/angular/lifecycle, is the section about avoiding OnPush for ion-nav or ion-router-outlet still relevant, now that Ionic 9 supports zoneless change detection?

[ShaneK]

Yeah, mostly. On Zone.js it still applies because a clean OnPush view stops the tick, so a page inside your outlet won't re-render when you mutate a plain field after an await. We hit that in v9 when Angular 22's OnPush became the default on ion-router-outlet and ion-tabs (which we had to fix for ionic-team/ionic-framework#31406), so both are pinned to Default now. Zoneless is fine, since marking a view for check walks OnPush ancestors anyway.

The ngOnInit bit is just out of date, in both modes.

[jbgtmartin]

Ok, so if I understand correctly, the issue applies to plain properties updates. If all my components inside <ion-router-outlet> already use signals and OnPush it's safe to switch to OnPush on the component that hosts the <ion-router-outlet>?

[ShaneK]

@jbgtmartin Yes, that's correct. I have a PR up here that I was making for related changes but went ahead and cleaned up the lifecycle phrasing for it: #4694

[jbgtmartin]

Thank you for the explanations here and in the PR, very clear :)