Por Jesús Cuesta Arza
Después de más de seis meses de espera, el pasado 28 de mayo llegaba la nueva versión de Angular, en este caso, Angular 8. ¿Quieres saber cuáles son los cambios más relevantes? ¿Qué modificaciones hay en las dependencias?
Suele ser habitual que cada seis meses se lance una nueva versión de Angular que aporte mejoras, elimine ciertas deficiencias del framework, actualice las dependencias y añada alguna nueva funcionalidad que nos sorprenda.
Esta nueva versión se ha hecho esperar más de lo habitual, pero no ha defraudado: Angular 8.0 incluye algunos breaking changes pero, para que la migración sea más fácil, Google ha facilitado esta guía.
Eso sí, puede suceder que algunos de los problemas que nos encontraremos si migramos nuestro proyecto, no estén indicados. Además, Angular 8.0 ha eliminado la primera versión que existía del componente para comunicaciones @angular/http que se había considerado obsoleto y que ahora ya no existe. También ha aparecido la necesidad de crear un parámetro adicional para poder utilizar @ViewChild y @ContentChild. Salvo estos estos "breaking changes", se han introducido pocos cambios, eso sí: muy interesantes y que mejoran el rendimiento.
¿Cuáles son las novedades?
Las más importantes en lo que a mejoras se refiere son:
- Mejora del rendimiento interno del framework.
- Mejora del compilador.
- Facilidades para las migraciones de versiones anteriores.
- Soporte y generador de webworkers.
- Mejoras en los Service Workers.
- Mejoras en Ivy.
- Mejoras en los Forms.
Respecto a los cambios, estos son más destacables:
- Nuevas funcionalidades en el routing de Angular.
- Cambio en las versiones de las dependencias de Angular.
- Cambios en HttpClient y RXjs.
- Cambio en la versión de node, nos sugieren la 12.
- Se incluye Browserslist.
Uno de los cambios que más destacan en esta versión es la carga diferencial o "Differential Loading". Esto permite a Angular compilar dos tipos de paquetes o "bundles" y, dependiendo de la versión del navegador que se esté utilizando, servirle uno u otro paquete sirviéndose de la tecnología ES6 Modules.
Gracias a ello, puedes seguir dando soporte a versiones antiguas de navegadores mientras que en las nuevas versiones puedes entregar una aplicación más liviana y menos compleja del código, ya que no tienes que adaptar funcionalidades no soportadas por el navegador antiguo ni incluir polyfills tampoco.
También hay deprecations:
- core: deprecada la integración con the Web Tracing Framework (WTF)
- platform-webworker: deprecado platform-webworker
Si necesitas saber cuáles son los elementos deprecados y cómo migrarlos, consulta esta guía.
Breaking Changes
- Cambios en el uso de ViewChild y ContentChild.
- TestBed.get: Para los test, el usarlo como any está ahora deprecado.
- @angular/http: ha sido eliminado y debería ser sustituido por @angular/common/http.
- Typescript: Deprecadas las versiones 3.1 y 3.2, deberemos usar 3.4.
Para conocer mejor los cambios y cómo aplicarlos, lo más recomendable es instalar una aplicación de Angular 8 y analizar las partes que han ido cambiando en esta versión y cómo ejecutar algunas de las funcionalidades nuevas. Si quieres conocer más detalles, no te pierdas el análisis de nuestro compañero Jesús Cuesta en este post de en mi local funciona.