A few years ago, developers were majorly debating on which framework they should be using for their projects : Angular vs React vs Vue. However, over the course of 2018 and 2019, there happened to be a growth of interest in a third framework known as Vue.js. Going forward into 2020, here we will have a detailed discussion on which is perhaps the best solution for you : Angular vs React vs Vue.
In the same survey, Vue surprisingly grabbed the second position, leaving Angular behind at the third position.
We know that each and every developer has a different skill level, knowledge, unique project requirements, complexities, deadlines, and so on. Thus, if React happened to be the top choice of 20,000 developers, it is not mandatory that it will fit your project requirements as well.
- Learning curve
- Single-page apps§
- Multi-page apps
- Known Projects
So, let’s get started…
- Brief Overview
Angular: Initially released in 2010 by Google developers, this framework’s first version was called AngularJS. It is the oldest framework out of the three. Based on the AngularJS, the Angular Team from Google released another framework in September 2016, known as Angular, but this one was created in Typescript. The last released version of Angular is 8, which was introduced in November 2019.
React.js: It was created in 2013 by Facebook developers and quickly won the hearts of programmers. It is a component-based UI library for creating user interfaces. The current release is 16.x and the announcement of the release of 17.x is still in waiting. Facebook makes use of React.js a lot in their products such as Facebook or Instagram.
Vue.js8: It is the youngest framework of the three which was released in 2014. In Spite of this, the framework has a huge popularity, and the community of supporters is still growing. The framework was developed by Evan You, and is not supported by any big company, rather is sponsored by donations.
Now, you are aware about the history of the three frameworks. It’s now time to check about the popularity of each framework. We are going to look at this point from two different prospects, by developer’s interest and by Google trends.
To have a closer look at the popularity of the three frameworks among the developers, let’s start from Github statistics. Have a look at the number of forks and stars for each framework, and the winners here are VueJS and ReactJS.
Another place where we are going to check the popularity of the three frameworks is Google Trends. This will tell us which framework is searched the most often in Google Search.
This shows that ReactJS happened to be the most popular framework in Google Search during the year, which implies that the popularity of the technology is still rising.
Angular happened to be the second and VueJS the last one, as per the Google Search. Although, we must consider the fact that VueJS being the youngest framework is doing great.
Here, we would like to focus more on the technical aspects of the three frameworks. Thus, we would have a look at the performance of ReactJS, VueJS, and Angular.
In order to check the loading time and bundle size of the three frameworks, three identical and very simple apps were created using Angular, React, and VueJS, run them and see the result. One must keep into consideration that the apps have been taken as without any additional care about performance. Furthermore, one should also remember that Angular comes with everything ready for development such as routing, etc. On the other hand, ReactJS and VueJS require a bunch of additional libraries.
Let’s have a look at the bundle sizes:
From the above table, we can see that ReactJS has the smallest bundle size, VueJS has twice that size, while the biggest bundle is from Angular.
Below, you can have a look at the screens from Chrome DevTools performance, and can observe the loading time. Here, the loading time has the best result for VueJS, which is about 936ms. React and Angular have similar results with about 3300ms.
Angular – Performance from Chrome Dev Tools
React – Performance from Chrome Dev Tools
Vue – Performance from Chrome Dev Tools
- Learning Curve
As per their background, developers will have varied points of views on which framework of the three is the easiest to learn.
Easiest learning Curve: VueJS
Steepest learning curve: Angular
Medium learning curve: ReactJS
So, the learning curve winner happens to be VueJS.
- Single-Page Apps (SPAs)
Single-page applications’ popularity is due to the fact that they load so fast. So, how do the three frameworks, Angular, VueJS, and ReactJS stack up in relation to developing SPAs? Angular was developed by Google explicitly for building SPAs. The use of TypeScript and all of the built-in tools and services of Angular make SPA development with Angular an amazing experience for a developer. Tools such as routing, form validation, and state-management solution allow for a fresh and up-to-date development experience. Use of VueJS or ReactJS for larger SPAs may bring bigger complexities as compared to when using Angular, like the availability of necessary packages for form support.
So, the Single-Page App winner is Angular.
- Multi-Page Applications (MPA)
MPA is a typical website like your favorite media site or ecommerce. Each time the site wants to send data to a server or to display new data, a request is sent to the server, which is exhibited in the browser.
Here, we can consider VueJS to be a little better as compared to ReactJS as there’s no need to use some special syntax (JSX) that needs a build step.
When creating an MPA, we would not recommend Angular. The all-in-one approach of the same to components and its use of TypeScript doesn’t make it the right framework here. Importing Angular packages into your HTML would prove to be complicated unnecessarily. If you try to compile TypeScript within an HTML-driven application such as an MPA, it will impact the performance and will also prove to be an annoyance to you as well as your development team. Overall, Angular was built to help you create SPAs. Though, it might become a more feasible option for MPAs in the future, we presently are not there yet.
So, the Multi-Page Application winner here is a tie between ReactJs and VueJS.
- Known Projects
As the last criteria in this list, we would like to mention some well-known projects developed using each of the three frameworks, to show you that it is possible to develop big things with any of the technology.
BMW Price Calculator
In this study, we compared three of the most popular front-end frameworks, ReactJs, Angular, and VueJS.
We started with a brief overview of each framework and later compared the popularity of the three. This aspect tells you that if you wish to find a useful framework to learn, then the best solution will be ReactJS. When the popularity was checked based on the Github statistics and Google Search, both VueJS and ReactJs have a strong supporters community.
When the performance was compared by running three identical apps on each of the three frameworks, then ReactJS was found to be having the smallest bundle size. However, the loading time was found to be the best in the case of the VueJs app.
Considering all the information you could read in this study, the choice of the most suitable framework out of Angular vs ReactJS vs VueJS as per your project requirements shall be easier now.
Hope you find this study useful to find the best framework in 2020 for your project. If you have any other query regarding the same, just drop us an email. Our team will respond back to you as soon as possible.