Change detection стратегиялары OnPush пен Default арасындағы айырмашылық неде? Неге OnPush қолдану керек?

Angular-да өзгерістерді анықтау стратегиясы (change detection) — Angular-ға компоненттердегі өзгерістерді қашан және қалай тексеру керектігін анықтайды және DOM-ды жаңартады.

Әдепкі — бұл стандартты стратегия, онда 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 өнімділікті арттыру үшін пайдаланылады, егер кіріс деректердің өзгермейтіндігін қамтамасыз ету және жаңартуларды қолмен бақылау мүмкіндігі болса.