June 16, 2026 3 min to read

Migrando a Angular 18, 19 y 20!

Migrando a Angular 18, 19 y 20!

Volvemos a la carga con la segunda tanda de migraciones! Esta vez le toca a Angular 18, 19 y 20, la racha que terminó de instalar signals en todos lados y nos empezó a despedir (de a poco) de Zone.js. Dejo de nuevo la docu y guía oficial para migrar y los comandos por acá.

Angular 18

1. Zoneless en developer preview:
   Arranca la previa de Angular sin Zone.js. Todavía no es el default, pero ya podés probarlo y empezar a sentir cómo cambia el árbol de change detection.

2. Material 3 por defecto:
   Angular Material pasa a usar Material Design 3 como estilo por defecto en los componentes nuevos.

3. Redirects basados en funciones:
   El router suma redirectTo como función, para armar redirecciones dinámicas según el estado de la app en vez de un string fijo.

4. Formularios reactivos más prolijos:
   Mejoras en la Reactive Forms API para manejar mejor formularios dinámicos y su estado.

5. Soporte para TypeScript 5.4:
   Como siempre, vamos de la mano con las versiones más nuevas de TS.

Angular 19

1. linkedSignal y resource():
   Nuevas primitivas reactivas: linkedSignal para signals escribibles que se resetean según otro signal fuente, y resource() para manejar datos asincrónicos de forma reactiva. Para entender bien el combo te recomiendo pegarle una revisada

2. @let en los templates:
   Llega estable la sintaxis @let, para declarar variables locales en el template sin tener que inventar workarounds raros.

3. Incremental Hydration (preview):
   Hidratación incremental basada en @defer, mostrando mejoras de hasta 40-50% en LCP. Todavía developer preview, pero promete.

4. Server Route Configuration:
   Más control sobre el render mode de cada ruta en SSR, eligiendo qué se renderiza en el server y qué no.

5. Angular Language Service mejorado:
   Mejor autocompletado y diagnósticos en el editor, sobre todo trabajando con signals.

Angular 20

1. Signals estables en todo el framework:
   Lo que arrancó como experimento en Angular 16 ya es la forma “oficial” de manejar reactividad. Forms, router, todo más conectado.

2. Incremental Hydration graduado:
   Pasa de developer preview a estable, consolidando esas mejoras de performance en SSR de las que hablábamos en la 19.

3. Type checking en host bindings:
   El compilador ahora chequea los tipos en host bindings y listeners directamente en el template, atajando errores antes de que exploten en runtime.

4. Zoneless dando pasos firmes:
   Sigue sin ser el default, pero cada minor que pasa lo deja más cerca. Si venís de la 18 probando la preview, en la 20 se siente mucho más sólido.

5. DevTools para deferred views:
   Ahora se puede inspeccionar el estado de hidratación incremental y los bloques @defer directo desde Angular DevTools.

Migración rápida

Para saltar de cualquiera de estas versiones a la siguiente, el comando de toda la vida sigue siendo el mejor amigo:

ng update @angular/core@20 @angular/cli@20

Y si vas paso a paso (18 → 19 → 20), mejor todavía: menos sorpresas, menos breaking changes de golpe. La guía oficial de actualización te tira el combo exacto de comandos según tu versión actual y destino, y la matrix de versionado te muestra qué TypeScript y Node necesitás en cada salto.

Happy coding!