Angular performance optimization: change detection mistakes you should avoid

Angular apps can stay fast for a long time, until they don't. A lot of performance issues i've debugged had nothing to do with bundle size or server speed. The real problem was change detection doing way more work than it needed.
Here are some common mistakes.

1. Using the default strategy everywhere

Angular's default change detection is convenient, but it checks more often than many apps actually need. For bigger applications, this can become expensive fast. Using OnPush in the right places can reduce unnecessary updates a lot.

2. Calling functions directly in templates

This one is easy to miss. every detection cycle will execute those functions again. If the function is expensive or creates new objects, performance can drop quickly.
Computed values should usually live outside the template.

3. Mutating objects with OnPush

A common mistake. With OnPush, Angular watches references, not deep changes. Mutating and existing object can prevent updates from rendering. Immutable updates make this much more prefictable.

4. Rendering large lists without trackBy

Without trackBy, Angular may recreate DOM elements unnecessarily. On big lists, that gets expensive. A simple trackBy can save a lot of work.

Most Angular performance problems are not caused by Angular. They usually come from small patterns repeated across the app. And change detection is often where those patterns hurt the most.