Estamos en la recta final de las pre-releases de Angular 16, ya nada se va a agregar según se comenta. Entonces, ¿cuales son las novedades de mayor interés en esta nueva versión?
DestroyRef
Un nuevo hook que permite invocar a la función ngOnDestroy (la que nos permite disparar código cuando el Componente es eliminado) pero con la particularidad de dejarnos hacerlo en cualquier parte del ciclo de vida de componente; lo cual puede traducirse como una mayor flexibilidad.
constructor() {
inject(DestroyRef).onDestroy(() => {
// Ejecutar código al destruir componente
})
}RxJS Reducido - Introducción a Signal
Como es sabido, hace ya varias versiones que el equipo de Angular quiere reducir la cantidad de código que involucra RxJS, especialmente en el core. Esto lleva una resistencia importante del sector de "veteranos" en el framework, pero ha sido muy bien recibido por quienes están comenzando. Por tal motivo, se mantiene la opción de utilizar RxJS para quienes se sientan cómodos, pero se ofrece la posibilidad de usar el nuevo objeto Signal. ¿Qué es una Signal? Es una función con cero argumentos, por lo tanto funciona como un "constructor reactivo", es decir que puede almacenar un valor que puede ser leído por un "consumidor". Ese valor puede cambiar, y cada vez que cambia produce una notificación a los "consumidores". Si se lo compara con RxJS, una Signal se comporta de manera similar a una Observable y su "consumidor" es algo así como el Observer. No es un reemplazo exacto, de hecho tiene más cosas que RxJS y a futuro es la idea que tiene Angular para reemplazarlo. Como gran ventaja, la sintaxis es sumamente sencilla y el código se integra de una forma muy orgánica a Angular. En mi opinión personal, es un buen momento para empezar a migrar ciertos códigos y empezar a jugar con Signal cuando se encuentre estable la versión 16.
Hydration API
Quizás para muchos no sea importante, pero un problema resuelto parcialmente por Angular es el SSR (Renderizado del lado del Servidor). Y digo parcialmente porque Angular Universal lo resolvió muy bien, pero ha estado quedándose un poco corto últimamente. La nueva API para SSR se propone introducir al renderizado un API de "Re-Hidratación", lo que traducido significa que en lugar de limpiar y destruir todo el DOM para renderizarlo nuevamente, se "rehidratará" para renderizar tan solo lo solicitado y mantener lo estático. Es un concepto interesante para aumentar el tiempo de respuesta de las Apps y WebApps realizadas en Angular. La mala noticia es que en esta versión solamente tendremos acceso a una Developer Preview, habrá que esperar mínimo a la versión 17 (este cambio es el equivalente al motor Ivy, no me extrañaría que demore varias versiones más).
Design Tokens en Angular Material
Una buena para la parte de estilos en Angular, se implementarán los Design Tokens directamente en la librería de Material. Brevemente, un Token es un fragmento de código que almacena valores de estilo (como tipografías o colores) con el objetivo de reutilizar dicho Token en cualquier Componente de Angular, partes de código e incluso plataformas. Esto permite personalizar el diseño de cada componente por separado, pero además un Token generado de esta manera puede usarse en una App de Angular y también en Figma, lo que facilita el traspaso de diseño de una plataforma a la otra (además de permitir rastrear fácilmente que estilos se aplica a cada componente). Es una gran funcionalidad que está llegando tarde pero que se agradece muchísimo.
