4 - JIT vs AOT

Ahead-of-time(AOT) vsJust-in-time(JIT)

Cuando trabajamos con Angular podemos compilar la aplicación en el navegador, en tiempo de ejecución, a medida que se carga la aplicación, utilizando el compilador Just-in-Time (JIT). Este es el enfoque de desarrollo estándar que se muestra en toda la documentación de la web de Angular (angular.io).

La compilación JIT tiene una penalización de ejecución. Las vistas tardan más en procesarse debido al paso de compilación dentro del navegador. La aplicación es más grande porque incluye el compilador angular y un montón de código de biblioteca que la aplicación realmente no necesita. Las aplicaciones más grandes tardan más en transmitir y son más lentas de cargar.

La compilación puede descubrir muchos errores de vinculación de plantilla de componentes. JIT compilación los descubre en tiempo de ejecución que es más tarde de lo que nos gustaría.

El compilador AOT (Ahead-of-Time) puede detectar errores de plantilla con anticipación y mejorar el rendimiento al compilar en el momento de la compilación.

Con AOT, el compilador se ejecuta una vez en el tiempo de construcción utilizando un conjunto de bibliotecas.

Con JIT se ejecuta cada vez para cada usuario en tiempo de ejecución utilizando un conjunto diferente de bibliotecas.

¿Por qué AOT compilación?

Rendimiento más rápido

• El navegador descarga una versión pre-compilada de la aplicación. El navegador carga código ejecutable para que pueda procesar la aplicación inmediatamente, sin esperar a compilar la aplicación primero.

Menos solicitudes asíncronas

• El compilador "inlines external" plantillas de html y hojas de estilo css dentro de la aplicación JavaScript, eliminando las solicitudes separadas de ajax para esos archivos de origen.

Menor tamaño de descarga de Angular

• No es necesario descargar el compilador Angular si la aplicación ya está compilada. El compilador es aproximadamente la mitad de Angular, por lo que omitirlo reduce drásticamente la carga útil de la aplicación.

• Detectar errores de plantilla con anterioridad

• El compilador AOT detecta e informa errores de enlace de plantilla durante el paso de compilación antes de que los usuarios puedan verlos.

Mejor seguridad

• AOT compila plantillas HTML y componentes en archivos JavaScript mucho antes de que se sirvan al cliente. Sin plantillas para leer y ninguna evaluación de HTML o JavaScript cara al cliente, hay menos oportunidades para ataques de inyección.

Como funcionan los navegadores

https://twitter.com/addyosmani/status/829728691798188034

Si, WOW es valido... hace muchas mas cosas de las que pensabas no ??? hace todo eso para levantar nuestro JS ... entonces hacer la pre-pasada ( mas la parte de compilación de angular) nos ahora tiempo y espacio... de hecho, en el CLI por defecto va a tratar de hacer la compilación con AOT.

Aclaración: Este capitulo es casi un clon de la documentación original de angular, ya que es complejo y esta muy bien explicado

( https://angular.io/docs/ts/latest/cookbook/aot-compiler.html )

Aclaración 2: En mi caso siempre que pueda elijo hacer AOT pero no siempre va a pasar eso, hay ciertos modulos que no soportan AOT, lo que si, cada vez que utilices el CLI va a tratar de compilar por defecto en AOT.