Henry Zarza

Estudiante de ingeniería informática

Desarrollador web

 ​    henryzarza

     henry_zarza

slides.com/

henryzarza/

ngzone

https://github.com/

henryzarza/

changeDetection-ngZone

¿Qué es?

Una zona es un contexto de ejecución que persiste a través de tareas asíncronas.

Tiene hooks como:

• onZoneCreated
• beforeTask
• afterTask
• onError

Logs:

// Before task
// After task
// Before task
// Async task
// After task

ngZone

Es la implementación utilizada en Angular para la ejecución de tareas asíncronas. Es un fork de zone.js

¿Cuándo y por qué?

Change Detection

¿Qué provoca un cambio?

1. Eventos en la interfaz.

2. Peticiones Ajax.

3. Ejecuciones dentro de timers.

ChangeDetectionStrategy

Default

vs

OnPush

¿Qué hacemos cuando necesitamos que la vista se actualice, aunque no cambie la referencia de nuestro componente?

ChangeDetectorRef

Métodos

• markForCheck
• detach
• reattach
• detectChanges
• checkNoChanges

¿Es necesario para el Change Detection?

Ejecutar tareas en el runOutsideAngular nos permite salir de la zona de Angular y trabajar sin disparar la detección de cambios .

Demo Time

Tips

Referencias

• https://blog.angularindepth.com/do-you-still-think-that-ngzone-zone-js-is-required-for-change-detection-in-angular-16f7a575afef
• https://blog.irontec.com/angular-changedetector-ngzone-y-asyncpipe/
• https://blog.angularindepth.com/i-reverse-engineered-zones-zone-js-and-here-is-what-ive-found-1f48dc87659b
• https://angular.io/api/core/NgZone
• https://blog.thoughtram.io/angular/2016/01/22/understanding-zones.html

¿Preguntas?

Gracias!