Aurelia y Angular son populares frameworks de cliente JavaScript que te permiten construir aplicaciones modernas para la web, móvil y escritorio. Proporcionan características modernas como la vinculación de datos, HTML extensible, SPA, enrutamiento, composición de la interfaz de usuario, etc para construir aplicaciones complejas.
En esta entrada del blog he tratado de comparar Aurelia y Angular, destacando las ventajas de Aurelia sobre angular junto con los pros y los contras de ambos.
Aurelia es discreto, fácil de aprender y entender debido a su filosofía de «convención sobre configuración», sólo hay que seguir algunas convenciones simples sin tales configuraciones como se requieren en el caso de Angular. Su sintaxis es fácil de recordar y le permite construir componentes en Typescript y en JavaScript vainilla también.
Aurelia y Angular, ambos se basan en el enfoque de Componentes y son similares en muchos aspectos. Angular está básicamente respaldado por el gigante informático Google mientras que Aurelia está desarrollado por Rob Eisenberg y su equipo, Eisenberg ha sido anteriormente un empleado del equipo Angular 2 de Google, dejó el mismo debido a algún desacuerdo y decidió construir una plataforma «discreta» con adhesión a los estándares web.
Esta es una de las ventajas de Aurelia. Su enfoque de «convención por encima de la configuración» es lo que lo hace discreto. No tienes que preocuparte por las cosas del framework, puedes centrarte principalmente en la lógica de tu aplicación.
En Aurelia, si estás creando un componente, no necesitas ningún decorador para anotar un componente, no tienes que preocuparte por la especificación de metadatos, sólo tienes que seguir las convenciones simples y Aurelia hará muchas cosas por sí mismo.
Veamos un ejemplo. Para crear un componente básico para imprimir «¡Hola Mundo!», el código Typescript de tus componentes puede ser:
Plantilla HTML:
El selector por defecto de su componente es <hola></hola> y su plantilla HTML se identifica por la convención del nombre del archivo.
El mismo componente en Angular
Código typescript:
Plantilla HTML:
En Angular, también es necesario declarar el componente en la sección de declaración del ngModule.
La creación de componentes parece más sencilla en Aurelia, ¿no?
Sintaxis de vinculación
La sintaxis de Aurelia es más fácil de aprender y recordar.
Sintaxis de vinculación de valores: attribute.command=»expression»
e.g. <input value.bind=»firstName»>
Sintaxis de enlace de eventos: event.command=»expression»
e.g. <button click.trigger=»sayHello()»>Say Hello</button>
Class binding:
e.g. <div class.bind=»isActive ? ‘active’ : »»></div>
Sintaxis de vinculación de Angular
Valor de vinculación: En angular ngModel directiva se utiliza para entradas de enlace, Tenga en cuenta aquí «ngModel» es sensible a las mayúsculas y minúsculas .
e.g. <input =»firstName» >
Evento vinculante: Esto es algo simple (evento)=»expresión»
por ejemplo, <botón (click)=»sayHello()»>Say Hello</button>
Enlace de clase: Tiene la sintaxis =»some-condition»
por ejemplo =»hero === selectedHero»
Rutas y navegación
La configuración de las rutas es básicamente similar en ambos frameworks pero con una diferencia importante. En Angular, las rutas para un módulo se definen de forma centralizada en una única configuración que define las rutas y los componentes enrutables junto con todas las subrutas, esto lo hace enorme y complejo.
Mientras que en Aurelia puedes definir las rutas padre en un lugar y poner la configuración de las subrutas en el componente hijo, esto oculta la complejidad interna y hace que los componentes estén totalmente encapsulados.
Soporte de lenguajes
Aurelia te ofrece amplias opciones para elegir entre ES5, ES 2015, ES 2016, ES.Next y Typescript para escribir tu código JavaScript.
Mientras que Angular restringe al usuario a escribir código en Typescript solamente.
Cumplimiento de estándares
Aurelia cumple debidamente con los estándares existentes y también con los estándares web emergentes.
Angular está muy por detrás en este caso, como señala la comunidad que se desvía de los estándares. Por ejemplo, HTML no distingue entre mayúsculas y minúsculas, pero Angular ha adoptado una sintaxis que distingue entre mayúsculas y minúsculas, como ngFor, ngModel, que el navegador no puede manejar de forma nativa.
Ecosistema y respaldo comercial
Angular está respaldado por el gigante informático Google, cuenta con un amplio ecosistema y apoyo de la comunidad. Aurelia está algo rezagado en este caso su ecosistema es más pequeño y los componentes de terceros no están ampliamente disponibles.
Pero su ecosistema está creciendo continuamente y está emergiendo como un marco popular debido a la facilidad de desarrollo por él, el cumplimiento de las normas y la simplicidad.
Documentación
Tanto Angular como Aurelia tienen una rica documentación y tutoriales, se puede aprender lo básico del marco con sólo seguir los tutoriales proporcionados en sus sitios.
Un punto negativo de Angular es que tiene una «curva de aprendizaje empinada», el equipo de Angular está continuamente actualizando su framework y estas actualizaciones son muy frecuentes por lo que tienes que seguir aprendiendo y adaptar los cambios necesarios.
Conclusión
Aurelia y Angular son dos potentes frameworks, Angular tiene más fama debido a su respaldo comercial por parte de Google y a un mayor apoyo de la comunidad.
Mientras que Aurelia es más sencillo, discreto y cumple más con los estándares, su política de «convención sobre configuración» hace que el desarrollo sea más fácil y rápido.