While trying to reduce useless component renders in an application I noticed Angular triggers changeDetection on click events, even for components with ChangeDetectionStrategy.OnPush

I’ve made a minimal example to reproduce the issue: stackblitz

Is there a way to limit renderings only on Input changes or async pipes updates ?

>Solution :

If you call function in template it will get called each time Change Detection is triggered.
This is considered very bad practice and you should avoid it at all cost.
(Do a quick google on the topic, there are a lot of resources explaning this more into details)

The proper way to check when the component is rerendered you should use lifecycle hooks for instance ngOnChanges.