It’s 2019, and the StackOverflow Developer survey results for this year are out. Guess what? For the seventh year in a row, JavaScript has been voted as the most popular programming language. In this post, we are going to compare the three most popular JS frameworks.
If you would rather watch a video to learn about this, checkout this video by Mosh, comparing React, Angular and Vue. It will help you decide which framework to choose for your next project.
With JavaScript being the most used programming language in the world, JavaScript Web frameworks and libraries like React, Angular and Vue are thriving. In this post, we are going to look at the most popular web framework in 2019.
React is the most loved and most wanted web framework by developers in 2019.
React tops the list and has been voted as the most “wanted “and most “loved” web framework. It is closely followed by Vue this year. Angular seems to be losing its popularity compared to the previous years.
React is at the top with 21.5%, followed by Vue at 16.1%, and Angular at 12.2%.## Three Most Popular Web Frameworks Today
Angular is a full blown web framework. It** has been around the longest among the three. **Angular was developed by Google and first released in 2010. It is a TypeScript based JavaScript framework. Angular (version 2 and above), originally released in September 2016, is a complete rewrite of AngularJS (released in October 2010).
React is a JavaScript library that is used to build frontend applications. React is backed by Facebook and was open sourced by Facebook in 2013. Ever since then, it has consistently gained popularity and today ranks as the most popular web library in the world. React is used far more at Facebook than Angular is at Google if it’s any indication as to how big Facebook is betting on this technology. They also have a dedicated team of developers working on React.
**Vue **is the new kid on the block. Unlike React and Angular, Vue is not backed by any corporation like Facebook or Google. Vue was developed by a group of passionate developers. It has elements of both React and Angular, and in my opinion contains the best of both worlds.
I did a quick search on Google trends to compare the search terms “React”, “Angular” and “Vue”. And it has the same results as the StackOverflow survey.
So why does everyone like React so much? Let’s study some differences and commonalities between the three most wanted web frameworks/libraries and see why React is everyone’s favorite.
Before React came into existence, Angular was the go to JavaScript framework for building modern web applications. Angular used the real DOM for UI manipulation.
The DOM in simple words represents the UI of your application. Everytime there is a change in the state of your application UI, the DOM gets updated to represent that change. Now the catch is, frequently manipulating the DOM affects performance, making it slow.
The more UI components you have, the more expensive the DOM updates could be, since they would need to be re-rendered for every DOM update.### React:
Now, React uses the Virtual DOM which performs significantly better than the real DOM. The use of a virtual DOM** **is one of its core features that makes it so blazingly fast. The virtual DOM is only a virtual representation of the DOM. If you want to learn about the React Virtual DOM and why it is faster, you can read this blog post I had written to get a better understanding.
This significant improvement in performance, contributed to the rise of React in comparison to the other frameworks and libraries.
You may now ask, what does Vue do? Vue came after React, and it took the concept of virtual DOM and essentially has a similar approach like React.
In this aspect, React and Vue are comparable. But Angular takes the hit in performance on large UI applications with the use of the real DOM.
Angular is a full blown framework, whereas React is only considered a JavaScript library. It offers strong opinions as to how your application should be structured. It also has much more functionality “out-of-the-box”. You don’t need to decide which routing libraries to use or other such considerations – you can just start coding. However, a drawback is that you have less flexibility with Angular.
React on the other hand is not an opinionated library. This could be good and bad depending on your perspective. I personally like that React offers a lot of flexibility and developers can choose their path.
For instance, React does not offer routing options, instead we can go with a third party solution for routing. React router which is a popular routing option is not a part of the official React library. Advanced state management can also be done with third party library support. You could use Redux, MobX or any other library for state management. This shows that React is flexible with the way you want to route your application, manage state etc.
But to a new developer this maybe a bit overwhelming since they have to shop for options instead of getting these out of the box. Experienced developers love this flexibility since they can leverage multiple options that are out there.
Vue is also a flexible framework. But, Vue is more opinionated than React. Unlike React, Vue offers Vuex for state management, Vue Router for routing, Vue Server-Side Renderer for server-side rendering all as a part of the official VueJs GitHub page. The Vue.js framework by itself comes bare-bones just like React, but they have all the add on items on their official page as a part of the Vue Ecosystem.
React is the most flexible solution
The flexible nature of the library, could be another reason that contributes towards React being the developer’s favorite framework.
Here is the list of various frameworks/libraries and their size.
Angular** **as you can see is large. It has everything you need from routing, templates, testing utilities and so on. The framework size is therefore huge and not suitable for lightweight applications.
React is a JavaScript library and not a framework. This means you don’t get much out of the box, and have to use other libraries for routing and other needs. This makes React suitable for lightweight applications.
Vue** **is even smaller and also suitable for light-weight applications. If you are looking for an extremely lightweight option, then Preact is smaller than Vue, and it is basically React, with some features stripped out.
Again, compared to Angular, there is a significant decrease in the size of the bundle making React more suitable.
Ionic
Ionic is a framework for developing hybrid mobile applications. It uses a Cordova container that is incorporated with Angular. Ionic provides a robust UI component library that is easy to set up and develop hybrid mobile applications with. However, the resulting app on a device is simply a web app inside of a native webview container. Because of this, the apps can be slow and laggy.
NativeScript + Angular
NativeScript lets you build native mobile apps on both iOS and Android. It can be used with a variety of frameworks. If you know Angular, then you can use NativeScript with Angular to build native mobile apps.
The NativeScript core team works with the Angular team at Google to ensure NativeScript and Angular are integrated. With this you can create native mobile apps with good performance. The only drawback here is that NativeScript has to constantly be in sync with the latest developments in the Angular world. Since NativeScript and Angular are two different solutions coming from two different companies, we never know when NativeScript may stop support for building apps with Angular.
React Native
The mobile solution that was born out of React is React Native. It is used to build native mobile apps using JavaScript and React. Today many fortune 500 companies are using it for their mobile space.
It is backed by Facebook, and was open sourced a few years ago. It is essentially React code. A React developer can easily pick up React Native, since the code is all written in JavaScript and React. The only difference is that instead of web components, it comes with native mobile components for iOS and Android.
This is a promising solution to build native mobile apps
Vue-Native
Vue has Vue-Native. The interesting thing about it is that, it is essentially a wrapper around React Native. Under the hoods, you need to setup React Native. This is not a stand-alone solution and cannot be used without React Native.
NativeScript + Vue
Just like NativeScript can be used with Angular, it can also be used with Vue. It enables you to build native mobile apps using NativeScript and Vue. Again, the drawback here is that NativeScript needs to constantly be updated to the latest development in Vue. And since they are coming from different teams and companies, we never know how long this support may last.
Today, React is the best choice, if you want to build mobile apps. React Native is ahead of the other options that are available to us from Angular and Vue.## Corporate Backing
**Angular **is developed and maintained by **Google. **Google uses Angular in several internal products as well as the Google Adwords application. This is one of the reasons, why Angular is trusted in the developer community.
React is backed by Facebook and was open sourced by Facebook in 2013. Facebook has a dedicated team of engineers who are working on React and making React better everyday. Since Facebook is heavily invested in React, many internal Facebook products are coded in React. With Facebook’s heavy involvement in React, the library has gained a lot of trust over the years.
Vue is not backed by any big corporation like React. Although Vue is not backed by big names, it has gained a huge name in the open source community. It is fairly new compared to React and is backed by a group of open source contributors.
Both Angular and React are backed by tech giants, which builds trust in the developer community.## Community and Developer Involvement
Let’s take a look at the open source community involvement in all the three frameworks to get a better idea on popularity, frequency of releases, etc. Take a look at this table below that compares them based on GitHub stats.
Something interesting to note here is that Vue, has the most number of stars among the three on GitHub. But it also has the least number of contributors. This means, people are interested in Vue, but it has still not gained the momentum that React and Angular has gained in the Open source community. React has around 126k stars, which is a lot for an open source library. This shows people like React as well. In comparison to that, Angular has only about 40k stars.
React also has a significant number of contributors. There are over 1290 contributors who are contributing to React, which is much more than Vue and Angular.
The final statistic on weekly downloads is quite intriguing. React has the most number of weekly downloads with a whopping number of 5,211,991. What is interesting is, Vue which is although new, comes second with 986,335 weekly downloads. You can notice here that Angular downloads are far less in comparison.
Based on the community and growth of frameworks, React is at the very top. Vue is liked by the community and upcoming. Angular on the other hand seems to be losing its spark and slowing down.## Verdict
JavaScript frameworks and libraries are evolving everyday. There is a lot to look forward to in the coming years. With respect to 2019, **React **is still at the top. And learning React will help you find a front-end job. **Vue **is upcoming, but it is young. Finding a job with Vue skills may take a while. Angular is still out there, and used by many companies and enterprises. Finding jobs with Angular skills will also be easy, but it is losing its spark. Developers are not eager to learn Angular, as much as much as they would like to learn React or Vue.
End of the day, you need solid understanding of any of these frameworks and JavaScript, to build solid front end applications. If you are new to React, and want to master it, I highly recommend Mosh’s course on Mastering React. This course will cover everything you need to be proficient at React.
If you enjoyed this post, please share it. And check back this space for more.
☞ Using Renderless Components in Vue.js
☞ Accessing the virtual DOM using render functions in Vue JS
☞ A comparison between Angular and React
☞ Getting Started with Nx in Angular
☞ Learn Angular 8 from Scratch for Beginners
☞ How to create a registration form using Angular 8 and Kendo UI
☞ Have Confidence in Your Redux Apps With Integration and Unit Testing
☞ Setup Continuous Integration (CI) With React, CircleCI, and GitHub
#vue-js #angular #reactjs