Resumen

El objetivo de este documento es exponer los pros y contras al usar Angular ó Vue como tecnologías de implementación.

Comparativa

A la hora de comparar distintas tecnologías hay varios factores a tener en cuenta, a continuación, se repasan los aspectos por separado.

Curva de aprendizaje

En general la curva de aprendizaje de Vue, en principio, es más sencilla que la de Angular, siendo esta última una tecnología que se tarda más en dominar.

Popularidad

En el momento de redactar este documento podemos comparar los datos recogidos de NPM y Github:

U obtener la popularidad según los votos en Stackoverflow en 2019 para Web Frameworks:

O podemos encontrar otros orígenes de datos con encuestas sobre el tema:

Lenguaje

Angular emplea de forma nativa Typescript. Vue admite 3 formas distintas de codificar:

  • Javascript

  • Typescript con sintaxis vanilla

  • Typescript con decoradores

Vue puede ser vista como una ventaja para los desarrolladores con experiencia en Javascript, pero a la vez puede ser una desventaja para los proyectos donde intervienen diferentes desarrolladores debido a que requerirá mayor coordinación para que todos programen igual.

Facilidad de uso

Vue resulta ser más sencillo que Angular, te permite estructurar tu aplicación de la manera que desees debido a sus mayores posibilidades de codificación.

Documentación oficial

La documentación de ambas es muy extensa.
Sin embargo, hay que matizar que la de Vue está en Javascript y no en Typescript.
Para implementar Vue+Typescript no se aplica de forma directa lo que dice su documentación.
En Angular, al tener nativamente Typescript sus ejemplos son directamente aplicables a los proyectos.

Desarrollo con “hot-reload”

En ambas, modificas uno o varios archivos y al guardar el cambio se ve reflejado automáticamente.
Parece que ambos funcionan correctamente, sin embargo, en Vue no es raro tener que hacer un Ctrl+F5 para recargar correctamente los cambios.

Rendimiento en ejecución

Sobre el navegador:

  • durante el desarrollo, Vue renderiza de forma casi instantánea, en Angular tenemos lapso de tiempo inicial donde puede haber un spinner.

  • en producción, la renderizacion es prácticamente instantánea en ambas tecnologías.

Componentes de terceros

Existen componentes para ambos, tanto gratuitos como de pago, Angular está más maduro en este aspecto.

Posicionamiento SEO

Tanto Angular como Vue ofrecen modos de generar pre-renderizado habilitando el posicionamiento SEO

PWA

Tanto Angular como Vue disponen de la posibilidad de adaptar la aplicación para cumplir PWA.

Depuración de errores

En ambas tecnologías es posible hacer depuración paso a paso con breakpoints desde Visual Studio Code, o debugear con las herramientas de desarrollador de Chrome.

Inyección de dependencias

Angular aplica este patrón de diseño de forma nativa y proporciona un motor de inyección de dependencias versátil que permite a las aplicaciones crecer de forma eficiente y modular.

Vue ofrece una implementación más pobre, permite la inyección global   de   dependencias   a   toda   la   aplicación   ó   una   primitiva   para   inyectar desde un componente sólo hacia sus descendientes. Para subsanar esto se apoya en Vuex.

Patrones de programación

Tanto Angular como Vue siguen el patrón MVVM cambiando el modelo cambia la vista, y desde la vista se puede cambiar el modelo.

Multi-navegador

Ambas tecnologías hacen uso de las librerías de Polyfills para ser Cross-browser, aportando compatibilidad con múltiples navegadores.

Carga perezosa

Ambas tecnologías pueden hacer lazy-loading de módulos en aplicaciones grandes.
Cambia la forma de gestionarlo, en Angular las dependencias entre los módulos determinan el número y dependencia entre chunks. Mientras que en Vue esto se gestiona desde la definición de las rutas y la dependencia entre componentes.

Nuevas versiones

El ritmo de nuevas versiones en Angular es más elevado que en Vue.
En la documentación de Angular indican que intentan liberar nueva “mayor” versión cada 6 meses.

Tabla de decisión