Acabo de actualizar mi aplicación AngularJS 1.6 siguiendo la guía de actualización de Angular 4 . Básicamente, agregué nuevas dependencias de angular 4 en package.json , arranqué la aplicación a través UpgradeModule y creé un nuevo componente simple en angular 4. ¡Todo funciona como se esperaba, pero el rendimiento es realmente malo!
La aplicación es una aplicación de tablero con potencialmente muchos componentes de widgets y muchas solicitudes http al backend para completar el contenido de cada widget.
Dependiendo del tablero, la aplicación actualizada es de 2 a 5 veces más lenta para cargar y mostrar el tablero, y la consola de red de Chrome muestra que las solicitudes http se ejecutan en una secuencia en lugar de dispararse todas a la vez como en la versión 1.6. En general, la interfaz de usuario también es mucho menos fluida.
Jugué con ngZone e intenté ejecutar solicitudes fuera de angular zone.runOutsideAngular(() => { ... }) para reducir el costo de actualización debido a la detección de cambios. El resultado es un poco más rápido pero mucho más lento que la versión original 1.6.
¿Hay algo a tener en cuenta al actualizar a una aplicación híbrida 1.6-4 para mantener un excelente rendimiento original? ¡Gracias!
Estamos usando una aplicación híbrida. De acuerdo con nuestras medidas, NG2 agrega aproximadamente un 20% al tiempo inicial de NG1. No es tan malo, pero hicimos mucho personal después de configurar híbrido: 1) - Paquetes en lugar de solicitudes múltiples para NG2 (gracias CLI) 2) - AOT para prod; JIT para desarrollo 3) - Tree-shaking 4) - Poly-fills condicionales (los navegadores modernos no requieren ningún poly-fill, pero son necesarios para los navegadores antiguos)
También estamos tratando de integrar el siguiente personal: 1) - Lazy loading. Pero no estoy seguro de si funciona para aplicaciones híbridas 2) - Web Worker para mover NG2 a un hilo separado. Pero nuevamente, todavía no estoy seguro de si funciona para aplicaciones híbridas 3) - Algunas estrategias personalizadas de detección de cambios
Aquí hay una buena lista de verificación sobre el rendimiento de NG2. Espero que te ayude.
Tengo una aplicación híbrida Ng1.5+Ng2.4.0. También tuve problemas de rendimiento con angular4 en modo híbrido por 2 razones.
Esto se relaciona con DEBUG solo porque ng4 realiza comprobaciones adicionales. En el modo de producción (llame a enableProdMode() antes de arrancar para encenderlo) angular4 incluso un poco más rápido que ng2.
import { enableProdMode } from '@angular/core';
enableProdMode ();
Ng4 en modo híbrido programa el resumen si alguna función de expresión de reloj en angularjs hizo una llamada asíncrona. Es decir, si usa la función de throttle de lodash en la expresión de reloj angularjs para reducir la tasa de resumen, entonces tener Ng4 puede tener el efecto opuesto: los resúmenes se pondrán en cola como una bola de nieve.