В чём разница между стратегиями change detection OnPush и Default? Зачем использовать OnPush?
Answer from AI
sobes.tech AI
В Angular стратегия обнаружения изменений (change detection) определяет, когда и как Angular проверяет компоненты на предмет изменений и обновляет DOM.
Default — это стандартная стратегия, при которой Angular проверяет компонент и все его дочерние компоненты при любом событии, которое может изменить состояние (например, событие пользователя, таймер, HTTP-запрос и т.д.). Это гарантирует актуальность данных, но может приводить к избыточным проверкам и снижению производительности.
OnPush — оптимизированная стратегия, при которой Angular проверяет компонент только если:
- изменился входящий @Input (сравнение по ссылке),
- произошло событие внутри компонента,
- или вручную вызван метод
markForCheck().
Использование OnPush позволяет значительно сократить количество проверок, улучшить производительность приложения, особенно при большом количестве компонентов и сложных деревьях. Это требует, чтобы данные были иммутабельными или обновлялись через новые объекты, чтобы Angular мог обнаружить изменения по ссылке.
Пример:
@Component({
selector: 'my-comp',
changeDetection: ChangeDetectionStrategy.OnPush,
template: `{{data.name}}`
})
export class MyComponent {
@Input() data: { name: string };
}
Если в родителе заменить data новым объектом, компонент обновится, если же изменить поле name у того же объекта, изменений не будет видно.
Итого: OnPush используют для повышения производительности, когда можно гарантировать иммутабельность входных данных и контролировать обновления вручную.