Angular vs. Aurelia: Who Wins?
April 01, 2020 / Bryan Reynolds
Reading Time: 11 minutes
A web application framework (WAF), also known as a web framework (WF), supports the development of web applications, which includes web application programming interfaces (APIs), web resources, and web services. Web application frameworks standardize the approaches developers use to build and implement web applications, largely by automating everyday tasks. For example, they often include libraries of routines that perform tasks like database access, session management, and creating framework templates. This routine helps promote the reuse of code, which reduces development time.
An Angular and an Aurelia developer includes the modern features needed to build complex applications such as HTML, routing, single page application (SPA), and user interface (UI) composition. However, significant differences in their performance and capabilities also exist, requiring careful consideration of many trade-offs. They both abide by rights reserved regulations.
A survey in early 2020 shows that the number of people who have used Angular and plan to continue using it has dropped by 2 percent compared to the same time in 2019. Furthermore, the overall interest in Angular dropped by about 1 percent.
Convention over Configuration
The Aurelia developers framework favors convention over configuration, so it has minimal impact on development. This software design paradigm, also known as “coding by convention,” reduces the number of decisions that developers need to make, ideally without sacrificing the experience of flexibility. David Heinemeier Hansson introduced this philosophy in Ruby on Rails, another web development framework. However, it’s closely related to earlier software development concepts, like the principle of least astonishment and sensible defaults.
Coding by convention essentially means that a developer only needs to specify an application’s unconventional aspects. For example, if a model has a class called Sales, the database will have a corresponding table called “Sales” by default. The developer doesn’t need to write code custom elements for these names unless deviating from this convention. Aurelia’s behavior is similar when writing configuration files; the developer only needs to specify settings when the desired behavior deviates from the convention services.
- Dependency injection
Open Web Standards
Aurelia developer also uses the Document Object Model (DOM) standard, independent of both platforms and language. This standard places web documents in a tree structure such that each node in the structure represents part of a document. Aurelia developer implements its own HTML parser and JS extensions, while also leveraging DOM APIs to optimize performance. It’s also based on the World Wide Web Consortium’s (W3C’s) Web Components, which will allow Aurelia development applications to evolve as this standard advances without requiring significant rewrites.
Rob Eisenberg is a central figure in the development core team of both Angular and Aurelia. He discussed his reasons for leaving the Angular team at Google to develop Aurelia in a 2016 interview with Cuttlesoft. Rob’s approach to software development services is heavily influenced by his love of music, which he also studied in college. He views the software development experience as a combination of art and reasoning with custom attributes, just as with musical composition.
Rob is a strong proponent of open-source software, which has dramatically affected his career as a professional software developer. He regards the developer community as one of its greatest advantages because it provides a sense of camaraderie that easily allows developers to get help. It also means a closer relationship between developers producing the source and its users, which helps the code grow more efficiently. Another advantage of open-source software is that bugs are identified and fixed faster because more eyes are looking at the code. Developers also have greater freedom, since there aren’t any owners to dictate the course that development should take.
Developers can build commercial add-ons for Aurelia development that support enterprises. Organizations can form a support level agreement (SLA) with Aurelia that puts both development teams in touch with each other. Enterprises can submit support tickets that receive priority according to the terms of the SLA. This added value is worth the cost for many enterprises since they can obtain the advantages of open-source software while retaining the support of proprietary software. Aurelia will also support version 1 clients for a year after version 2, while users make this transition.
Rob expects the trend towards open-source development services to continue growing. Software, specifically Aurelia development services, is already where some open-source code is a virtual necessity. Organizations that have previously been reluctant to adopt open-source developments are beginning to recognize its benefits. More developers want open-source, making adoption more a matter of management and company politics than a technical issue. Major players like Apple and Microsoft are embracing open source, and other developers will soon follow suit.
In particular, Microsoft has kept web applications and software development as part of its core competency, which isn’t the case with Google. Most of their revenue comes from ads, so they take a very different approach to software development. While they are working on Angular as an open-source project, they don’t consider it a Google product, nor do they consider Angular developers to be their customers. On the other hand, Microsoft does consider .Net developers to be their customers. This difference in business perspective has profound implications for open-source developers.
Reasons for Leaving Google
Rob left Google due to irreconcilable differences he had with the rest of the Angular team. He felt their design choices wouldn’t be sufficiently flexible when Angular was implemented. He also thought Angular’s development services process was disconnected from its user community, especially when work began on version 2. Despite Google’s strong interest in supporting its users and data availability, it never produced any case studies or use cases for Angular.
The Angular development team is organized as a subteam of Google’s Adwords Customer Relationships Management (CRM) team. The Adwords CRM system thus drives anything Angular does because it isn’t an independent product. Angular doesn’t have a business side because it’s funded internally by Adwords, which has its own agenda.
- Convention over configuration
- Standards compliance
- Commercial backing
- Language support
- Convention over Configuration
Convention over Configuration
Aurelia core team developers can also focus on application logic without worrying about Aurelia framework issues. For example, developers can make an Aurelia component without annotating it with a decorator or specifying metadata. Aurelia developers take care of many of these things by itself, provided the developer follows simple conventions. As a result, development takes less time in Aurelia than in Angular since Aurelia programmers can concentrate more on business logic.
Aurelia’s highly modular approach to software design allows developers to build applications the way they want without being forced into particular rules or paradigms. Developers can also replace individual modules more easily in Aurelia since they can be used separately or as a full framework.
Aurelia is fully compliant with existing web standards, as well as those that are currently emerging. Angular is far behind on this issue and is continuing to deviate from the standards. Aurelia libraries are more agnostic than Angular, meaning they contain mostly vanilla JS and TS classes. Developers can easily change implementations and test their code more easily in Aurelia while maintaining a business orientation experience.
Case sensitivity is one of the most obvious areas where Angular’s lack of compliance has implications for developers. Standard HTML is case-insensitive, so HTML tags in the Aurelia framework are case-insensitive. Angular uses case-sensitive syntax, so it can’t use HTML parsers in web browsers. That means web browsers can’t handle directives like ngFor and ngModel natively. NgFor changes the structure of the DOM, allowing it to repeat a given HTML template for each value in an array. The Ng-model directive binds the value of HTML controls to application data.
The Aurelia framework allows developers to wrap all templates in a single tag easily. This task is challenging to accomplish in Angular and may not be possible at all. Even if when is, Angular requires the developer to provide the templates and elements’ names.
The difference in design philosophy between the two framework developments is also apparent when binding events to actions. Aurelia easily supports both one-way and two-way binding, which is difficult in Angular and can lead to confusion among developers. In one-way binding, data only flows from objects to the user interface (UI). Two-way binding allows the synchronized transfer of data between objects and the UI, meaning any changes in one are reflected in the other.
Aurelia defaults to one-way binding, following conventional wisdom. Two-way binding is more common for uses, such as binding an input widget to a particular view-model. However, many developers consider two-way binding to be an anti-pattern experience, making it difficult to understand what the code is doing in complex applications. Aurelia’s syntax to bind variables within a class is also similar to the way JS does it. Aurelia developers can specify the type of binding they’re using, which aids in single page application self-documentation.
A recent survey by Hot frameworks consistently shows that Angular is more popular than Aurelia across multiple scoring methods. Angular has a Github Score of 90, a Stack Overflow score of 95, and an overall score of 92. In comparison, Aurelia has a Github Score of 75, a Stack Overflow score of 63, and an overall score of 69. One reason for Aurelia’s comparative lack of popularity may be the lack of major, successful web applications built in Aurelia, until recently. Microsoft just published their careers site using Aurelia!
- Aurelia Market Share Source Data
- Angular Market Share Source Data
- Aurelia Github and Stack Overflow Stats
- Angular Github and Stack Overflow Stats
Angular is backed by Google, which provides it with a broad ecosystem and user community. However, this large community also means that Google doesn’t provide Angular users with individual support, so it’s completely open-source.
Aurelia has a smaller ecosystem, so its third-party components aren’t widely available. It supports Aurelia applications through its base company Blue Spire Inc., which also provides consulting services for Aurelia users. Furthermore, Aurelia’s ecosystem experience is growing rapidly, mainly due to its ease of front end and back end development, simplicity, and standards compliance.
Angular requires the developer to write JS code only in Typescript. Aurelia developers can use Typescript, but they can also choose other coding languages like ECMAScript (ES) and all its variants, which provide developers with much more flexibility. While developers can use ES in Aurelia, they’re still strongly encouraged to use Typescript because most of Aurelia’s documentation and resources use Typescript.
ES is a specification for scripting languages published by Ecma International to standardize JS, which has remained ES’s widespread implementation since it was published in 1997. Other common variants of ES include ES5, ES 2015, ES 2016, and ES .Next. Aurelia also has tools like Gulpfiles, which aid in converting one ES variant to another.
Both frameworks similarly handle routing configuration, although the definition of those routes is significantly different. In Aurelia, developers define parent routes in one place and put the configuration for sub-routes into the child components. This approach completely encapsulates the components, hiding their inner complexity. Angular developers must define a module’s routes within a central configuration file, including paths, routable components, and sub-routes. This approach makes route definition much more complex in Angular.
Aurelia and Angular both have an abundance of documentation and tutorials, allowing developers to learn the basics of these frameworks by following the tutorials on their respective sites. The most noticeable difference in this area is that Angular’s documentation has a steeper learning curve. The main reason for this difference is that Angular continuously updates its framework, requiring developers to learn new changes and adapt to them constantly. Furthermore, Angular is the more complex framework, making it more challenging to transition from simply using to changing how it works.
Aurelia works well with other frameworks and has an advantage in interoperability over Angular. For example, Developers can use React components by creating a custom Aurelia element. Aurelia also works with Polymer, since they’re both based on the WebComponents standards.
Both Angular and Aurelia are evolving rapidly, and both products will experience significant changes in the near future.
Angular 9 is a major upgrade, with the most significant changes, including using the Ivy compiler and runtime by default and single page application. This change makes Angular bundles smaller and provides Angular with improvements in run time, debugging, type changes, and builds stability. In addition to the overall improvement in the Ivy compiler’s performance, the latest version of Angular has faster build time since it enables ahead-of-time (AOT) compilation by default. The long-term effects of IVY on developer interest in Angular remain to be seen.
Angular has also been updated to work with TypeScript 3.6 and 3.7. Additional changes include an improved binding for Cascading Style Sheets (CSS) and improved internationalization. Furthermore, Angular v9 includes hundreds of bug fixes.
The most critical changes in future releases of Angular are likely to include improvements to Ivy, significantly reducing the bundle size and run time.
Aurelia 2 will be the next major version of Aurelia, which should be released shortly as of March 2020. This version retains all of Aurelia’s current capabilities but improves them significantly. It still uses the same component model and syntax for binding and templating. The dependency injection (DI), compositional approach, and emphasis on standards are also unchanged in Aurelia 2, with rights reserved.
Many of the changes in Aurelia 2 are improvements to existing tools, which are essential for a framework to be viable today. Aurelia 2 will work with bundlers and loaders more effectively since it follows the latest module loading standards. Several of these bundles and build tools are based on vanilla JS. Enhanced debugging tools in Aurelia 2 will also improve error messages, logging, and stack tracing.
Aurelia 2 takes a new approach to project scaffolding to make this process more comfortable than ever. Developers will no longer need to install an Aurelia-specific command-line interface (CLI) to build projects. They’ll simply use Node.js to run npx, allowing them to generate a new project ready for deployment. No additional installations will be necessary.
The Aurelia 2 team also integrates Visual Studio (VS) into Aurelia 2 to improve its context-sensitivity, or IntelliSense, which is useful for functions like automatically completing attributes and binding expressions. Aurelia uses non-breaking templating syntax, so IntelliSense will also work in Aurelia. Developers also need comprehensive documentation of their framework as their projects grow, especially for design language and components. Aurelia 2’s support for Storybook will help accomplish this requirement.
Angular and Aurelia are both front-end frameworks for modern application development. They also support third-party tools, allow the integration of existing applications, and abide by rights reserved regulations. The best choice depends on the parameters the developing organization values most, including community support and security. The ease of resolving technical problems with application and component functionality is also an important factor in choosing between Angular and Aurelia.
The most obvious difference to non-developers between the two frameworks is that Angular has a more extensive user base and community, primarily due to Google’s backing. However, Aurelia is more stable than Angular, so Aurelia would be preferable in high-end applications where quality and security have great value. On the other hand, Angular may be preferable when the application size is small, but the rate of requests is high.
At Baytech Consulting, a custom web application development company, we have completed many Angular and Aurelia projects. Overall, we use Aurelia when given a choice.