¿Cuál es la diferencia entre $ evalAsync y $ timeout en AngularJS?

He estado usando AngularJS durante un tiempo, y he encontrado la necesidad de usar $ timeout de vez en cuando (parece ser que generalmente se inicia un complemento jQuery).

Recientemente, he estado tratando de obtener una comprensión mejor y más profunda del ciclo de resumen, y me encontré con la función $ evalAsync .

Parece que esa función produce resultados similares a $timeout, solo que no le das retraso. Cada vez que lo he usado $timeoutha sido con un retraso de 0, así que ahora me pregunto si debería haberlo usado $evalAsync.

¿Hay alguna diferencia fundamental entre los dos? ¿Qué casos usarías uno sobre el otro? Me gustaría tener una mejor idea de cuándo usar cuál.

Recientemente respondí esencialmente esta pregunta aquí: https://stackoverflow.com/a/17239084/215945 (Esa respuesta se vincula a algunos intercambios de github con Misko).

Para resumir:

• si el código se pone en cola usando $ evalAsync desde una directiva , debe ejecutarse después de que Angular haya manipulado el DOM, pero antes de que el navegador muestre
• si el código se pone en cola usando $ evalAsync desde un controlador , debe ejecutarse antes de que Angular haya manipulado el DOM (y antes de que se muestre el navegador); rara vez quiere esto
• si el código se pone en cola usando $ timeout , debe ejecutarse después de que Angular haya manipulado el DOM y después de que el navegador se procese (lo que puede causar parpadeo en algunos casos)

Para aquellos que crean aplicaciones complejas, tenga en cuenta que hay un impacto en el rendimiento de su elección. Además, me gustaría completar la respuesta de Mark con más detalles técnicos:

• $ timeout (devolución de llamada) esperará a que se realice el ciclo de resumen actual (es decir, actualización angular de todos los modelos y DOM), luego ejecutará su devolución de llamada, que posiblemente afecte al modelo angular, y luego lanzará un completo $applyen la raíz $ alcance y redirigirá todo.

• $ evalAsync (devolución de llamada) , por otro lado, agregará la devolución de llamada al ciclo de resumen actual o siguiente. Lo que significa que si está dentro de un ciclo de resumen (por ejemplo, en una función llamada desde alguna ng-clickdirectiva), esto no esperará nada, el código se ejecutará de inmediato. Si está dentro de una llamada asincrónica, por ejemplo a setTimeout, $applyse activará un nuevo ciclo de resumen ( ).

Entonces, en términos de rendimiento, siempre es mejor llamar $evalAsync, a menos que sea importante para usted que la vista esté actualizada antes de ejecutar su código, por ejemplo, si necesita acceder a algún atributo DOm, como el ancho de los elementos y similares.

Si desea más detalles sobre la distinción entre $ timeout, $ evalAsync, $ digest, $ apply, lo invito a leer mi respuesta sobre esa otra pregunta: https://stackoverflow.com/a/23102223/1501926

También asegúrese de leer la documentación :

$ EvalAsync no garantiza cuándo se ejecutará la expresión, solo que:

• se ejecutará después de la función que programó la evaluación (preferiblemente antes de la representación DOM).
• se realizará al menos un ciclo de $ digest después de la ejecución de la expresión.

Nota: si esta función se llama fuera de un ciclo $ digest, se programará un nuevo ciclo $ digest . Sin embargo, se recomienda llamar siempre al código que cambia el modelo desde una llamada $ apply. Eso incluye el código evaluado a través de $ evalAsync.