¿Cuál es el ciclo de resumen en AngularJs?

Reloj AngularJs: lo proporciona AngularJs Framework para realizar un seguimiento de las variables de alcance y el cambio en sus valores. Los relojes son creados automáticamente por AngularJs Framework. Por lo general, se realiza para enlaces de datos y para qué variables decide AngularJs Framework. Las funciones personalizadas que se crean para los relojes se denominan detectores de relojes.
Números de relojes: si el número de relojes es inferior a 2000, el rendimiento es mejor. Podemos usar la extensión de observadores angulares para contarlos. Angular realiza la observación de variables vinculadas a datos, pero si queremos, también podemos realizar la observación de variables normales, utilizando la función de observación. Toma como parámetro la variable que explícitamente queremos observar.
Lista de vigilancia: Mantiene una lista de todas las vigilancias asociadas con una aplicación angular. es decir, todos los enlaces de datos que se supervisan. Se mantiene una lista de vigilancia para todos los ámbitos, incluido el raíz.

Ciclo de digestión

una verificación sucia de

Los oyentes de observación se ejecutan automáticamente cada vez que el proceso de resumen encuentra modificaciones en las variables. Toma nota de los cambios y luego notifica a AngularJs Framework para actualizar DOM. Por lo tanto, al final de cada proceso de resumen, se actualiza DOM.
Angular Context es un entorno de tiempo de ejecución de AngularJs Framework.
El primer proceso de resumen realiza una verificación sucia en los relojes y verifica si hay alguna modificación
. Nuevamente realiza el segundo ciclo de verificación sucia en el ciclo anterior, observa a los oyentes. Porque puede haber variables que han sido modificadas por otras. Se realizan un mínimo de 2 iteraciones y se pueden ejecutar un máximo de 10. Aunque se prefiere minimizar el ciclo de digestión para un mejor rendimiento. El error se lanza después del máximo.

Actualización de primer y segundo nivel

Actualizaciones de primer nivel: suponga que la variable b se actualizó por cualquier evento, luego, durante el primer ciclo, el ciclo Digest informa al marco AngularJs sobre los cambios y pasa por el segundo ciclo después de eso. Como no hay más actualizaciones, actualiza DOM y lo completa.

Actualizaciones de vigilancia de segundo nivel: cada vez que se encuentra un cambio en el primer ciclo para cualquier vigilancia en particular, digamos c, el proceso de resumen ejecuta el detector de vigilancia para ello. Ahora observe que el oyente modifica aún más la variable a a un nuevo valor. Después del primer ciclo, c se actualiza. Durante el segundo ciclo, encontramos cambios en a y, por lo tanto, se lleva a cabo una actualización para a. Ahora tiene lugar un tercer ciclo y no se encuentran más modificaciones. DOM se actualiza.
Un ejemplo para actualizaciones de segundo nivel:

$scope.a = 1;
$scope.b = 2;
$scope.c = 3;
  
$scope.$watch('a', function( newValue, oldValue ) {
       if( newValue != oldValue ) {
           console.log("a is modified to " +newValue );
}
});
  
$scope.$watch('b', function( newValue, oldValue ) {
       if( newValue != oldValue ) {
           console.log("b is modified to " +newValue );
}
});
  
$scope.$watch('c', function( newValue, oldValue ) {
       if( newValue != oldValue ) {
           console.log("c is modified to " +newValue );
                if( $scope.c > 50 ) {
                     $scope.a = 1000;  
                 }
}
});
  
$rootscope.$watch( function() {
       console.log(" digest iteration started ");
});

Teniendo en cuenta que las variables de alcance a, b, c están vinculadas a los datos y son elegibles para el proceso de resumen. Si inspeccionamos la aplicación angular en el navegador y abrimos la consola. Podemos rastrear los cambios ya que las declaraciones de impresión nos ayudarán. Supongamos que hubiera un enlace bidireccional para c con un cuadro de entrada, podríamos rastrear fácilmente la cantidad de veces que se modifica. De hecho, también podemos inspeccionar el proceso de resumen aplicando la función $watch en $rootscope.
$watch: esta función toma tres parámetros: expresión de observación, oyente e igualdad de objetos. Excepto por la expresión, los otros dos son opcionales.

El proceso de resumen comienza con el ámbito raíz y luego identifica los otros ámbitos. Si nuestro código usa eventos DOM (ng-click), ajax con devolución de llamada, temporizador con devolución de llamada, cambios de ubicación del navegador, invocaciones manuales como $apply, entonces seguramente tendrá un proceso de resumen para todos ellos.

Como sabemos, el navegador es responsable de representar el DOM y puede tener eventos como Temporizador, Al hacer clic. El navegador mantiene una cola para estos eventos llamada Cola de eventos. Y los envía a Javascript. En consecuencia, se lleva a cabo un resumen para ellos. Si los eventos no están relacionados con Javascript, es decir, están escritos en Jquery u otros lenguajes, entonces es nuestro deber escribir la función $apply para mantener el resumen de ellos.

$scope.$apply(function() {    
});

Escenario completo del ciclo Digest:

Publicación traducida automáticamente

Artículo escrito por ajaychawla y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta Cancelar la respuesta