Marca "Angular"
No sabría definir si se trata de una funcionalidad nueva, pero tiene sus beneficios. Luego de muchos años Angular decidió cambiar de logo y con eso inicia una transformación completa también de su sitio web y, más importante, de su documentación. Fuera de mis opiniones sobre el logo o el sitio (que no cambian la experiencia con el framework) la nueva doc experimental es sumamente recomendable para el aprendizaje y experiencia futura. Destaco, claramente, los modos sandbox en los ejemplos, que nos permiten jugar un poco con el código que estamos aprendiendo.
Nueva Sintaxis en Template / Flow Control
Esta es una de las grandes novedades de esta versión, que ya fuimos adelantando cuando salió la información hace varios meses. Concretamente se implementa una nueva forma de utilizar las directivas NgIf, NgFor y NgSwitch en el control de flujos. Lo interesante es que la sintaxis es mas parecida a la programación en JavasScript / TypeScript, y hace que sea mucho más fácil debuguear y entender el código nuevo. Para dar un ejemplo:
@if (user.isHuman) {
<human-profile [data]="user" />
} @else if (user.isRobot) {
@defer {
<robot-profile [data]="user" />
}
} @else {
<p>The profile is unknown!</p>
}
Esta es la nueva forma de hacer un NgIf. Como puede apreciarse, la idea del equipo de Angular es que escribamos estructuras de programación como estructuras en si y no las mezclemos con el HTML. Es un cambio sumamente positivo a la hora de armar un template, y viene con su propio resaltado de sintaxis.
Lo interesante además es el rendimiento, especialmente en las estructuras NgFor (ahora llamadas @for), donde las pruebas reportaron hasta un 90% de mejora de rendimiento. Hay unas tablas comparativas donde se ve como en una versión alpha 17 se probó renderizar una lista de mil elementos con ngFor y con @for donde se pasó de casi 48 segundos a 45; o un swap de filas con mil elementos, donde con ngFor se demoraba 166 segundos y con @for tan solo 25.
Por el momento este nuevo flow control sigue siendo una función preview, por lo tanto para probarla hay que instalar un paquete; sin embargo, si las pruebas son satisfactorias, posiblemente lo veamos estable en la versión 18. Y si lo están pensando, si, se usarán script para migrar automáticamente el código de template viejo al nuevo.
Server Side Rendering (SSR) y Static Site Generation (SSG)
Por fin Angular trae esto a otro nivel, empezando por configurar automáticamente mediante un prompt al crear un nuevo proyecto. Esto permite hacer más sencilla su implementación, especialmente para nuevos usuarios o aquellos que en su día probaron el Angular Universal y les resultó tedioso.
Otra gran novedad en este sector es el concepto de "hydratation" en el renderizado con SSR, cosa que ya se implementó en Angular 16 pero a forma de preview, con Angular 17 se incorpora de manera estable y definitiva.
Además, gracias a que Firebase es un producto de Google como Angular, se generó una mejor vinculación entre ambos. Ahora la app de firebase reconocerá automáticamente los proyectos de Angular por más que no estén configurados, mediante un CLI. Esto permite generar en pocos comandos un proyecto vinculado con Firebase completo, rápido y sin errores.
Nuevos LifeHooks
Esto fue inesperado, aunque de alguna manera evidente con los nuevos cambios. Por primera vez en mucho tiempo Angular trae unos nuevos LifeHooks, Son los afterRender y afterNextRender. En líneas generales, afterRender se dispara cuando la app termina de renderizarse y afterNextRender se dispara cuando la app se vuelve a renderizar. Son hooks muy interesantes, porque se llaman unicamente desde eventos del DOM, permitiendo aplicar lógicas al propio DOM de forma muy segura; ya que vamos a tener la seguridad de estar trabajando con la App completamente renderizada.
Siguientes pasos
Angular ha incluido versiones preview y detalles sobre cosas a implementar en el futuro cercano. Concretamente quieren potenciar todo el tema de reactividad (mediante Signals), mejorar las herramientas de testing (un pedido grande de la comunidad) y ya están empezando a probar Material 3, el cual promete ser revolucionario a nivel UI.
