“Which is better for my startup, React or Angular?”
This is a question I’m often asked by both developers and entrepreneurs as part of my work as the Lead frontend developer at Altar.io.
It’s also a question I see a lot online:
I have a wealth of experience using both of these frameworks since the day they launched. And, to be completely honest with you, both React and Angular are fantastic technologies.
In this article, I will delve into each of them, to determine if one is better than the other, and if so, which is the best.
Let’s start with a quick overview of both of these frameworks – to get acquainted with them better.
React & Angular: A Brief Overview
What is Angular?
Angular (a.k.a Angular 2+) is a development platform built on TypeScript and managed by Google’s Angular team, as well as the Angular developer community. It’s an open-source framework used to build scalable web and hybrid applications. It has a collection of well-integrated libraries.
Angular as we know it today was launched in 2016, as a complete redesign of Angular JS (a.k.a Angular 1.0) – which was first released in 2010.
Angular has a steeper learning curve than React, developers are sometimes challenged to adapt and learn the many features – however Angular handles scalability better when developing mid-to-large applications.
It’s grown in popularity and is now used by some of the largest companies in the world including:
- Forbes
- Samsung
- Lego
- Disney
- PayPal
- Microsoft
And many many more. To see the full list of projects made with angular, check out this gallery.
Related: Angulartics2 – A Powerful Analytics tool for Angular Applications
What is React?
React.js is an open-source JavaScript library created and managed by Facebook. It’s component-based and uses a declarative style of programming to build User Interfaces (UI).
Just like Angular, it’s used to build web applications. As well as native-rendered apps and mobile applications.
React’s core principle of “learn once, write anywhere” allows developers to build fast and scalable applications for all platforms without rewriting existing code. This makes the learning curve much shallower, however, React doesn’t handle scalability as well as Angular does.
A plethora of tech giants have used React in production for years including:
- Meta (Facebook and Instagram)
- Netflix
- Uber
- Airbnb
- Atlassian
- The New York Times
Community Popularity
A quick look at Stack Overflow’s annual developer report for last year will tell you that React is by far the most popular web framework among professional developers.
41.4% of developers preferred React. Angular came third with 26.23% of developers favouring the framework. One in four developers who aren’t already using React also wish they were, according to the same survey.
Among professional developers, the popularity of React is clearly superior to Angular.
Let’s delve into why that is, starting with Performance & DOM.
Do you have a brilliant idea that you want to bring to life?
From the product and business reasoning to streamlining your MVP to the most important features, our team of product experts and ex-startup founders can help you bring your vision to life.
Performance & DOM (Document Object Model)
Both React & Angular are great options for building applications, however, there’s one key difference between the two.
React uses virtual DOM, whereas Angular uses real DOM.
To contextualise this, let’s create an example. Say you want to update a user’s profile details – like their first name. Real DOM would update the entire tree-like structure of HTML tables until it reaches the correct data point (user’s first name).
Conversely, virtual DOM updates the chosen data (user’s first name) without rewriting the structure of the HTML doc. This means updates to the UI will render much quicker.
Data Binding
As well as looking at Performance & DOM we need to look at data binding when comparing React vs. Angular.
Data binding is the process of synchronizing data between business logic and UI.
Here, React uses one-way data binding. Meaning that when creating a React App, developers will most likely “nest” child components within higher ranking parent components. Think of it as the hierarchy of headings in an article or web page: Heading 1 is the parent of Heading 2, etc.
Angular uses both one and two-way data binding. Here, changing data impacts the way you view it. More than that, changing the view triggers changes in the data.
The one/two-way data binding of Angular makes the framework much simpler to work with, and much more flexible. That being said, the one-way binding of React gives the code more stability and makes debugging simpler.
Bundle Size
Another important consideration in the React vs. Angular debate is bundle size. After all, the smaller the bundle, the faster it loads. This has a direct impact on your app’s performance and ultimately, conversion rate.
Both Angular and React use Webpack which splits your code into smaller parts to reduce the bundle size. Along with dynamic imports (loading code as it’s needed, as opposed to all at once) and “tree-shaking”. Also known as dead-code elimination, tree-shaking ensures that unused models won’t be included in the bundle as the app is built.
Angular is a fully-fledged framework and ships a lot of features in the core. This produces a larger output and, sometimes can burden your projects. Translating into a heavier application with slower performance compared to React.
On the other hand, if you have a large application with a lot of dependencies, Angular can be better because it has an ecosystem of features built already.
Conversely, React relies on third-party packages to achieve the same goals as Angular in this situation – as we will see in the “scalability” section below.
Scalability
You should always have in mind your project’s future scope, even on day one.
Here, Angular takes the cake. It’s packed with core features to help developers add new functionality to an app and scale it easily.
It’s the reason that generally, Angular is used for larger-scale projects.
That being said, React can still be used for larger apps through the development of a maintainable architecture with server-side rendering.
But it’s important to note here that React relies heavily on third-party packages to scale well – whereas Angular has them built-in. When dealing with third-party libraries the authors may not keep them as up-to-date.
This means you could be scaling your app and find that one of the libraries that you’re depending on is left dormant by the author. This could potentially create roadblocks in your development process.
Of course, even though Angulars packages are first-party, you could face a similar situation – but it’s not as likely.
Which is Better For Your Startup? React vs. Angular
Both React and Angular are great tools for frontend development. There is a laundry list of advantages to each.
That being said, I would say deciding which is “best” for your startup comes down to one simple question:
What are you building?
If you’re building a small, lightweight app with a shortlist of features, React is probably the framework for you. It’s impressively fast thanks to its support for the virtual DOM. This results in a good user experience which directly enhances your SEO.
Simply put, you can use React anywhere without sacrificing performance. It allows you to effortlessly deploy across multiple platforms thanks to the framework ecosystem behind it – like React Native for mobile app development.
Just bear in mind that if you have to scale your app to be much larger, you may find React limiting further down the line.
If you’re setting out to build a large, enterprise-grade application with a myriad of features, I would recommend looking into Angular for your frontend needs.
Angular is great for applications that need to change displayed content dynamically at the will of the user, thanks to its structure and efficient data binding.
Despite its bundle size, Angular’s tools still make it the best choice for enterprise-grade applications.
Lastly, if you’re still unsure which is the right choice for your startup, you can reach out to me here – I’d be happy to have an informal conversation to go over your specific project and the pros and cons of both frameworks.
André is Partner & VP of Engineering at Altar.io. He has a background in visual arts, has previously founded his own startup and has experience at major corporations such as Barclay’s and BNP Paribas as a Senior Frontend Engineer.
