Novedades de Angular 10.1

Angular 10.1.0, una versión de seguimiento de Angular 10, se lanzó el 2 de septiembre, trayendo mejoras de rendimiento al compilador y al enrutador junto con una nueva herramienta de extracción de mensajes. 

Angular 10 estuvo disponible de forma generalizada como una versión de producción el 24 de junio. La principal actualización del marco basado en TypeScript desarrollado por Google puso más énfasis en la calidad, las herramientas y las mejoras del ecosistema que en las nuevas funciones.

Angular 10 es más pequeño que las versiones anteriores de Angular. Las nuevas capacidades incluyen un nuevo selector de rango de fechas en la biblioteca de componentes de la interfaz de usuario de Angular Material y advertencias para las importaciones de CommonJS. Las advertencias de importación de CommonJS alertan a los desarrolladores cuando una dependencia empaquetada con CommonJS podría dar como resultado aplicaciones más grandes y lentas, lo que permite a los desarrolladores sustituir un paquete de módulos ECMAScript.

Además, las configuraciones opcionales más estrictas ofrecen una configuración de proyecto más estricta al crear un nuevo espacio de trabajo con ng newvia ng new --strict. Habilitar esta bandera inicializa un nuevo proyecto con nuevas configuraciones para mejorar la capacidad de mantenimiento, ayudar a detectar errores y permitir que la CLI realice optimizaciones avanzadas en una aplicación.

Dónde descargar Angular 10

Puede encontrar la versión general de Angular 10 en GitHub. Para actualizar su instalación Angular actual, puede ejecutar este comando:

ng update @ angular / cli @ angular / core

Nuevas funciones en Angular 10.1.0

La versión Angular 10.1.0, disponible en GitHub, incluye las siguientes nuevas capacidades y mejoras: 

  • Para mejorar el rendimiento en el compilador-cli, Angular 10.1 tiene una solución para las regresiones de rendimiento que afectan la reutilización incremental del programa.
  • Para el rendimiento del enrutador, prioritizedGuardValuese está aplicando el operador para optimizar las CanLoadprotecciones.
  • ProgramBasedEntryPointFinderse reutilizará EntryPointManifestpara cargar dependencias de punto de entrada cuando sea posible, lo que evita tener que analizarlas nuevamente en cada invocación de ngcc.
  • Se admite una nueva herramienta de extracción de mensajes, que eventualmente se integrará en la CLI.
  • Para la herramienta de compilación Bazel, LinkabablePackageInfose está agregando a la ng-moduleregla, lo que permite al vinculador vincular correctamente los ng_moduledestinos en las acciones de tiempo de ejecución de Node.js.
  • Se agrega más información al diagnóstico producido para errores de evaluación estática.
  • Se ha agregado una opción para el soporte absoluto de URL HTTP.
  • Se ha agregado compatibilidad con TypeScript 4.0 al compilador.
  • canparse() los diagnósticos están expuestos.
  • Se han realizado mejoras de rendimiento en el enrutador, los formularios, la CLI del compilador y la herramienta de compatibilidad del compilador ngcc.
  • La modificación de los enlaces del ciclo de vida se puede realizar en cualquier momento antes del arranque.
  • Se ofrecen varias correcciones importantes para el núcleo, el enrutador y otras partes de Angular.

Nuevas funciones en Angular 10

Las características clave de Angular 10 incluyen las siguientes:

  • TSlib, la biblioteca en tiempo de ejecución para TypeScript que contiene funciones auxiliares, se ha actualizado a TSlib 2.0. La herramienta de análisis estático TSLint para TypeScript se ha actualizado a TSLint 6.
  • Se ha agregado una interfaz de compilador que envuelve el compilador ngtsc real. El compilador específico del servicio de lenguaje gestiona varios archivos de comprobación de tipo utilizando la interfaz del proyecto, creando Scriptinfos según sea necesario.
  • La configuración del navegador para nuevos proyectos se ha actualizado para excluir los navegadores más antiguos y menos utilizados. El soporte está en desuso para Internet Explorer 9, Internet Explorer 10 e Internet Explorer Mobile.
  • El formato de paquete angular ya no incluye paquetes ESM5 o FESM5, lo que ahorra tiempo de descarga e instalación cuando se ejecuta yarno npm installpara paquetes y bibliotecas angulares.
  • Para el compilador, se han agregado intervalos de nombres para lecturas de propiedades y llamadas a métodos.
  • EntryPointFinder, se ha agregado un buscador de puntos de entrada basado en programas que se puede sembrar a partir de las importaciones en un programa especificado por un archivo tsjconfig.json. Se espera que esto sea más rápido que DirectoryWalkerEntryPointFindercuando el programa activo solo importa una pequeña proporción de los puntos de entrada instalados. 
  • El autocompletado se está eliminando de las entidades HTML, por ejemplo &, debido a un valor cuestionable y un problema de rendimiento.
  • El mapeo explícito se expone desde el cierre a los archivos devmode. Esta característica está dirigida a herramientas de desarrollo que tienen que traducir entradas de compilación de producción a sus equivalentes de modo de desarrollo.
  • En un cambio radical, el genérico se ha hecho obligatorio para ModuleWithProviders. Se ha requerido un parámetro de tipo genérico para que el ModuleWithProviderspatrón funcione con la compilación de Ivy y la canalización de renderizado, pero antes de esta confirmación, View Engine permitió que se omitiera el tipo genérico. Si un desarrollador usa ModuleWithProviderssin un tipo genérico, una migración de la versión 10 actualizará el código. Pero si un desarrollador usa View Engine y depende de una biblioteca que omite el tipo genérico, se emitirá un error de compilación. En este caso, ngcc no ayudará y la migración solo cubrirá el código de la aplicación. Se debe contactar al autor de la biblioteca para arreglar su biblioteca. Como solución alternativa, skipLibChecks podría configurarse como falso en tsconfig o actualizar una aplicación para usar solo Ivy.
  • TypeScript 3.9 ahora aparece, y se ha eliminado la compatibilidad con TypeScript 3.8. Este es un cambio radical. TypeScript 3.6 y TypeScript 3.7 tampoco son compatibles.
  • Se han realizado mejoras en el rendimiento de la verificación de tipos en compiler-cli.
  • Para mejorar el rendimiento, el cálculo de basePathsse ha hecho perezoso, por lo que el trabajo solo se realiza si es necesario en TargetedEntryPointFinder. Anteriormente, basePaths se computaba cada vez que se creaba una instancia del buscador, lo que era una pérdida de esfuerzo en el caso de que el punto de entrada de destino ya se había procesado.
  • Se admite la combinación de varios archivos de traducción. Anteriormente, solo se permitía un archivo de traducción por configuración regional. Ahora los usuarios pueden especificar varios archivos por configuración regional, y las transacciones de cada archivo se fusionarán por ID de mensajería.
  • Se pueden configurar tiempos de espera de bloqueo asíncronos. Esto agrega soporte para el archivo ngcc.config.js para configurar las  opciones retryAttemptsy retryDelaypara AsyncLocker. Una prueba de integración agrega una nueva verificación para un tiempo de espera y usa ngcc.config.js para reducir el tiempo de espera y evitar que la prueba tarde demasiado.
  • En un cambio radical, las advertencias sobre elementos desconocidos ahora se registran como errores. Si bien esto no dañará una aplicación, puede hacer que las herramientas que no esperan que se registre nada se registren a través de console.error. 
  • En otro cambio importante, cualquier solucionador que regrese EMPTYcancelará la navegación. Para permitir que la navegación continúe, los desarrolladores deben actualizar los resolutores para actualizar algún valor, como default!Empty.
  • La adición de información de dependencia y selectores de contenido ng a los metadatos. Esta función de compilador propuesta proporcionaría metadatos adicionales útiles para herramientas como Angular Language Service, ofreciendo la capacidad de proporcionar sugerencias para directivas / componentes definidos en bibliotecas.
  • Mejoras de rendimiento, logradas mediante la reducción del tamaño del manifiesto de punto de entrada y una técnica de almacenamiento en caché en el manifiesto. Además, el almacenamiento en caché de las dependencias se realiza en el manifiesto del punto de entrada y se lee desde allí en lugar de calcularse cada vez. Anteriormente, incluso si un punto de entrada no necesitaba procesamiento, ngcc (compilador de compatibilidad de Angular Ivy) analizaba los archivos del punto de entrada para calcular las dependencias, lo que llevaría mucho tiempo para los módulos large_node.
  • Para mejorar el rendimiento de ngcc, ahora se permite la notificación inmediata de un archivo de bloqueo obsoleto. Además, se almacena una copia en caché de un archivo tsconfig analizado que se puede reutilizar si la ruta tsconfig es la misma.
  • En un cambio radical, se actualizó la lógica relacionada con el formato de los períodos de días que cruzan la medianoche. Al formatear una hora con el código de formato bo B, la cadena renderizada no manejaba correctamente los períodos de días que abarcaban días. En cambio, la lógica estaba volviendo al caso predeterminado de AM. Esta lógica se ha actualizado para que coincida con las horas dentro de un período de un día que se extiende más allá de la medianoche, por lo que ahora mostrará la salida correcta, como at nighten el caso del inglés. Las aplicaciones que utilicen formatDate()o DatePipeo los códigos de formato bBse verán afectadas por este cambio.
  • Para el enrutador, el CanLoadguardia ahora puede regresar Urltree. Un CanLoadguardia que regresa Urltreecancela la navegación actual y redirecciona. Esto coincide con el comportamiento actual disponible para los CanActivateguardias que también se ha agregado. Esto no afecta la precarga. Un CanLoadguardia bloquea cualquier precarga; las rutas con CanLoadguarda no se precargarán y los guardias no se ejecutarán como parte de la precarga.
  • Propagación del intervalo de valor correcto en un ExpressionBinding de una expresión de microsintaxis a ParsedProperty, que a su vez propagaría el intervalo a los AST de plantilla (tanto VE como Ivy). Esta propuesta también es para el compilador.
  • En una solución al núcleo, se agregaría lógica a la migración de clases sin decorar para decorar clases derivadas de clases sin decorar que usan características angulares.
  • En un cambio importante, el tipo de Urlmatcher reflejará que siempre podría devolver un valor nulo.
  • Para el trabajador del servicio, se ha solucionado una situación en la que existía la posibilidad de que el trabajador del servicio nunca se registre cuando hay una tarea de larga duración o un tiempo de espera recurrente.
  • Se han realizado varias correcciones de errores, incluido el compilador que evita expresiones indefinidas en una matriz perforada y el núcleo evita un error de migración cuando se importa un símbolo inexistente. También hay una solución en el núcleo para el error de inserción de Terser. Otra corrección de errores identifica correctamente los módulos afectados por anulaciones en TestBed.
  • Angular NPM ya no contiene ciertos comentarios jsdoc para admitir las optimizaciones avanzadas del compilador de cierre. Este es un cambio radical. El soporte para el compilador de cierre en paquetes ha sido experimental y no funciona durante algún tiempo. Cualquiera que use Closure Compiler probablemente sea mejor consumiendo paquetes Angular creados a partir de fuentes directamente en lugar de consumir versiones publicadas en NPM. Como solución temporal, los usuarios pueden considerar el uso de su canal de compilación actual con el indicador de cierre --compilation_level=SIMPLE. Esta bandera asegurará que la canalización de compilación produzca artefactos construibles y ejecutables, a un costo de mayor tamaño de carga útil debido a la desactivación de optimizaciones avanzadas.