Add Your Heading Text Here
Angular Vs React - Our perspective on all the buzz
Back in 2019, we bagged a prestigious contract with the Scottish Fire and Rescue Service to develop a number of state-of-the-art single page applications. Our main front-end framework was going to be Angular 8, which at that point in time was the most current stable version of Angular and arguably the most popular, well supported client-side framework available. Google’s Angular was well ahead of its Facebook rival React in terms of adoption. Today, the scales are evenly poised, perhaps even tipping in favour of React.
Anyone with an interest in emerging web technology has no doubt come across atleast one, mostly likely both of these popular frameworks. There’s so much buzz about them that companies are keen to adopt one for their latest applications to get trending. Project mangers love being involved with them and developers usually swear by one or ther other. At DC, we love both but we’re often asked the question: which one?
While our own developers are biased as well, we think the correct answer is the infamous “it depends”. Without delving into the technical specifics, we offer our insights into both in this article, helping businesses understand them on a high level.
Why you should consider them both
It is important to point out that both these well supported , well documented frameworks, along with their support for EcmaScript ES6+, have taken client-side development to a new level of sophistication, allowing for powerful applications to be built. They are however, built with different philosophies. While React at its core is a pure UI framework, Angular is a full fledged “package” with off-the-shelf support for advanced features such as dependency injection, unit tests, mobile devices support and progressive web applications.
Angular had a headstart with its AngularJS framework before the more popular Angular2 and subsequent improvements were made building on a well compartmentalised, scalable architecture. React on the other hand, was a revolutionary framework. While Angular took a traditional javascript-on-top-of-HTML approach, React adopted a HTML-on-top-of-Javascript approach, putting Javascript first. This may not sound all that radical but it allowed for one revolutionary feature – it allowed for the creation of a “virtual” DOM where the markup was created on the fly, as opposed to a “real” DOM. This made it super fast. And developers just loved it!
Javascript enthusiast? React might be for you.
While both Angular and React support ES6, Angular soon strongly favoured adopting Typescript (TS) in versions later than AngularJS. React on the other hand has always remained ambivalent about TS. Although it is possible to use TS with React, it was built with pure javascript and JSX, unlike Angular which was built with Typescript.
Angular’s architecture advantage
For Object Oriented, strongly typed programming enthusiasts, Angular therefore appears very attractive with a built in support for Typescript. That also brings with it, an ability to create highly complex applications using easily readable strongly typed code. Now you might argue the same could be said for React since it is also possible to use TS with React. There is however, one more card up Angular’s sleeve – a component based MVC/MVVM like architecture. Angular architecture allows for creating highly compartmentalised, powerful enterprise-level applications a lot more easily as a result.
With React however, the focus is on developing highly robust UI. It is lighter than Angular and because it isn’t a full fledged framework like Angular, there isn’t built in support for mobile applications, progressive web apps, or dependency injection (although these can be obtained by external libraries).
State management - React's weakness
In React, each UI component has it’s own state which makes managing an overall application state a real hassle. React projects therefore almost always use REDUX as a result, which is a library to allow for global state management more easily. On the other hand, Angular applications are a building block of Angular components which are typically built in a hierarchy, each one capable of maintaining a state as well as passing down its state to “child” components. Although Angular projects are extensively use REDUX, it does allow for better state management off-the-shelf.
A verdict?
We shall refrain from the thankless task of recommending one over the other. Like we said, it depends but while it does depend, we believe the potential game changer is React’s virtual DOM and the speed it offers. As a general rule of thumb therefore, we would consider Angular where the application is likely to be large, complex and scalable. We would favour React where the application is likely to be large, complex and needing to be fast and performant.