(+34) 673 566 782 - (+34) 960 653 052 formacion@imaginagroup.com

Angular 7 ya está disponible y estas son sus nuevas características

¡Por fin! Angular 7 ya está entre nosotros, siendo una nueva versión importante ya que afecta a la plataforma completa, implementando cambios tanto a nivel de herramientas, como de nuevas funciones que dan como resultado final una mejora excelente en el rendimiento. Continuando con la tendencia reciente en versiones anteriores, la actualización se realiza de una forma sencilla realizándose de una forma más rápida que nunca.

Veamos a continuación algunos de los aspectos más destacados y nuevas funciones que esta versión tiene que ofrecer.

Angular 7 ya está disponible

Avisos en la CLI

El equipo de Angular siempre se ha centrado constantemente en mejorar las herramientas disponibles para los desarrolladores y las nuevas indicaciones en la interfaz de línea de comandos (CLI) no son diferentes. Generalmente cuando ejecutamos comandos como ng new o ng add, son una una simple pasada. ¿Qué te olvidaste de incluir el enrutamiento? ¡Vaya! ¿Quieres saltar las instalaciones? Bueno, supongo que puedes terminar el comando.

Ahora el nuevo CLI responde con indicaciones. Simplemente intenta ejecutar ng new myangular7app y ¿qué obtienes? Un mensaje nuevo que te preguntará si deseas agregar el enrutamiento. ¿Quieres probar un formato de hoja de estilo diferente? No te preocupes. La CLI te permitirá seleccionar entre CSS, SCSS, SASS y otras muchas opciones. ¡Y lo mejor de todo, es personalizable! Agrega un schematic.json usando la CLI de esquemas y puedes decirle a la CLI de Angular qué indicaciones debe ejecutar.

Diseño “Material” y el Component Development Kit (CDK)

ScrollingModule

Dado que muchos frameworks en entorno móvil han comenzado a avanzar hacia la carga dinámica de datos, como imágenes o listas largas, Angular ha seguido su ejemplo al agregar el ScrollingModule para permitir el desplazamiento virtual. A medida que los elementos ganan o pierden visibilidad, se cargan y descargan virtualmente del DOM. El rendimiento se incrementa en gran medida a los ojos del usuario. La próxima vez que tengas una lista potencialmente grande de elementos para que tus usuarios se desplacen, pégala en un componente cdk-virtual-scroll-viewport y ya verás como aumenta el rendimiento.

Puedes leer aquí más sobre scroll virtual en Angular 7.

DragDropModule

Ahora puedes permanecer dentro del módulo de Angular Material e implementar el soporte de arrastrar y soltar, incluida la reordenación de listas y la transferencia de elementos entre listas. El CDK incluye representación automática, controladores de arrastre, controladores de caída e incluso la capacidad de transferir datos.

Aquí tienes más información sobre arrastrar y soltar con Angular 7.

Rendimiento de la aplicación

Lo primero es lo primero: Angular 7 es incluso más rápido que las versiones anteriores. La actualización es más rápida (menos de 10 minutos para muchas aplicaciones según el anuncio oficial), el marco es más rápido, el módulo CDK de desplazamiento virtual detallado anteriormente hace que las aplicaciones se ejecuten con un mejor rendimiento

Aquí es donde las cosas se ponen interesantes: Angular no solo se dedica a hacer el marco lo más pequeño posible, sino también a hacer que sus aplicaciones sean lo más pequeñas posible. Han corregido un error de producción común en el que se incluye el polyfill llamado reflect-metadata. La actualización a V7 lo elimina automáticamente.

Los nuevos proyectos ahora también están predeterminados usando “Budget Bundles” que funcionan para notificarle cuando su aplicación está alcanzando límites de tamaño. De forma predeterminada, recibe advertencias cuando alcanza 2 MB y errores a 5 MB. Y cuando necesites un poco más de espacio, simplemente configura el archivo angular.json y ajusta según sea necesario.

"budgets": [{
  "type": "initial",
  "maximumWarning": "2mb",
  "maximumError": "5mb"
}]

Nuevas dependencias

Angular depende de Typescript 3.1, RxJS 6.3 y se ha agregado soporte para Nodo 10.

Ivy Renderer

El equipo de Angular continua con el desarrollo del renderizado. Aún no se comprometen en fijar una fecha de entrega, ya que el desarrollo sigue en progreso. Hay que apuntar que la validación de compatibilidad ha comenzado y, aunque ningún miembro oficial del equipo ha comentado nada al respecto, se espera que se lance una versión beta completa durante la vida útil del V7 con un posible lanzamiento oficial junto con la versión 8.

Puedes seguir el progreso en el GitHub Ivy Renderer bajo el repositorio oficial de Angular. Se espera que Ivy pueda ser lanzada en una versión menor siempre y cuando esté completamente probada y validada

Actualización

Para la gran mayoría de las aplicaciones de Angular, y suponiendo que ya se están ejecutando en Angular 6 y RxJS 6, simplemente tendrás que ejecutar un solo comando:

$ ng update @angular/cli @angular/core

Si tienes cualquier duda puedes visitar la Guía de Actualización.

Uso de cookies: Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies

ACEPTAR
Aviso de cookies