logoImagina
iconCurso
Te recomendamos nuestro curso de Angular 18
Descubre el curso de Angular 18
Ir al curso

Angular 8 ya está aquí y estas son sus Novedades

iconImage
Escrito por Equipo de Imagina
Actualizado el 19-09-2024
Duración: 15 min

La actualización de Angular 8 añade una gran cantidad de funcionalidades para navegadores modernos y mejora de rutas. Si quieres más información sobre la última versión de Angular puedes consultar las novedades de Angular 17 o nuestro tutorial sobre cómo actualizar a la última versión.

Pantalla de ordenador mostrando el logo de Angular 8 como introducción hacia sus novedades

Angular Router

Se añade un modo de retrocompatibilidad para simplificar la actualización del path de proyectos grandes, permitiendo usar $route para los lazy loadings de AngularJS.

Carga Diferencial de JavaScript

Generar un proyecto con el CLI producirá paquetes de JavaScript antiguo (ES2015) y moderno (ES2015+), esto ayudará a los navegadores modernos a cargar más deprisa las páginas al tener ya el compilador para ES2015+.

Rutas

Se ha agregado una opción de navegación basada en hash a setUpLocationSync. Con este método, los desarrolladores ahora pueden pasar una opción a setUpLocationSync para garantizar que los cambios de ubicación se ejecuten en aplicaciones basadas en hash.

CLI

Se ha agregado soporte para tokenizar un subconjunto de una cadena de entrada y tokenizar cadenas de escape. CLI ya no soporta símbolos externos por defecto.

Descubre la formación a tu medida
Rellena el formulario para obtener más información sobre los cursos.
Tamaño de la empresa *
Términos y condiciones *

CSS

Con el respaldo de SASS para Bazel, las reglas se agregan al área de trabajo para un proyecto que requiere la extensión SASS a CSS. Con SASS, los desarrolladores pueden escribir estilos visuales para un sitio web en un lenguaje más avanzado que se compila en CSS.

Se ha implementado una corrección de errores en la que se ha aumentado el límite de memoria de nodos para ng-module para evitar problemas de memoria insuficiente con módulos grandes. Cuando la memoria no se libera correctamente o un proceso continúa usando más y más, puede producirse un fallo en el proceso.

Ivy

Con la versión 8 vas a poder elegir entre el motor Ivy o el View Engine clásico para generar los proyectos, aunque Ivy no será viable para todo los usos, ya que su lanzamiento definitivo será en versiones de Angular posteriores.

Las ventajas de Ivy en este versión son:

  • Hacer que el código angular sea más fácil de depurar, incluso a medida que las aplicaciones crecen.
  • Mejora de la comprobación de tipos de plantillas.
  • Mejora de la retrocompatibilidad. Para comprobar estos añadidos podemos realizar un proyecto de Angular 8, para descargarlo, como aún está en RC, que es el último estado del desarrollo antes del final utilizamos el comando:
1npm install -g @angular/cli@next

Y para iniciar el proyecto debemos añadir enable-ivy al final del comando para iniciar el proyecto, ya que esto era una característica opcional:

1ng new ivy-app --enable-ivy

Una vez creado el proyecto podemos ir al archivo tsconfig.app.json y veremos que dentro de angularCompilerOptions, la clave enableIvy está asociada a true, es decir que está activada, también podemos cambiarla por false si queremos volver a nuestro View Engine clásico en cualquier momento.

1 "angularCompilerOptions": { 2 "enableIvy": true 3 }

A continuación, iniciamos el proyecto de prueba con el siguiente comando dentro del directorio:

1ng serve

Ahora podemos observar que el código fuente del navegador que los hay algunos imports que tienen el atributo nomodule, esto significa que los navegadores que no soportan ES2015+ cargan ese import, mientras que los demás no lo necesitan al interpretar ES2015+ de manera nativa.

Esto se puede configurar en el archivo browserlist, cuya configuración por defecto es la siguiente:

1last 2 versions 2Firefox ESR 3Chrome 41 Support for Googlebot< 4not dead 5not IE 9-11 For IE 9-11 support, remove 'not'.

Esto quiere decir que acepta las últimas dos versiones de cada navegador, además Chrome 41, Firefox ESR exceptuando Internet Explorer 9 y 11.

Descubre la formación a tu medida
Rellena el formulario para obtener más información sobre los cursos.
Tamaño de la empresa *
Términos y condiciones *
Tutoriales relacionados
Qué es Node.js y Por qué Debes Usarlo
Descubre Qué es Node.js y Cómo puede ayudarte como Desarrollador web: Guía Completa de Node.js para principiantes
Cómo Implementar Seguridad y Autenticación en Apps .NET 8
Aprende a implementar seguridad y autenticación en aplicaciones .NET 8. Protege tus datos y fortalece la confianza del usuario. ¡Tutorial completo!
Firebase Crashlytics: Gestión de Errores en Firebase
Descubre por qué Firebase Crashlytics es esencial para detectar, priorizar y solucionar errores en tu aplicación, garantizando su estabilidad.
Qué son las Angular Signals y Cómo Funcionan
Aprende cómo funcionan las Angular Signals y descubre cómo estas herramientas facilitan la comunicación entre componentes en Angular.
Tabla de contenido
Angular Router
Carga Diferencial de JavaScript
Rutas
CLI
CSS
Ivy
Descubre la formación a tu medida
Rellena el formulario para obtener más información sobre los cursos.
Tamaño de la empresa *
Términos y condiciones *