Choosing the right framework for a new JavaScript system, application or website is a top priority for any business. So, how are we supposed to decide? A pros-and-cons list never hurts. Spoiler Alert…. I love React.js
React
React is developed and maintained by Facebook and used in their own products, including Instagram and WhatsApp. It has been around for roughly three and a half years now, so it’s not exactly new. It’s also one of the most popular projects on GitHub, with about 74,000 stars at the time of writing. Sounds good to me.
Angular
Angular (version 2 and above) has been around less than React, but if you count in the history of its predecessor, AngularJS, the picture evens out. It’s maintained by Google and used in AdWords and Google Fiber. Since AdWords is one of the key projects in Google, it is clear they have made a big bet on it and is unlikely to disappear anytime soon.
Although Angular continues to see increased growth in usage, it’s falling further behind React. Another factor for both frameworks is the rise of Vue. It’s growing at a very fast rate and has a good chance of unseating Angular as the second most popular framework by the end of the year.
Why choose React?
React JS is leading in United States, Japan, Brazil, China and 107 other countries.
React JS has better usage coverage in more websites categories. Including People & Society, Arts & Entertainment, Religion & Spirituality, News & Media and 159 other categories.
- JSX is a JS syntax that enables HTML quotes and usage of HTML tag syntax for sub-components rendering. It promotes building of machine-readable code and provides ability to compound components in one compile-time verified file.
- Reactjs is extremely efficient as itcreates its own DOM (virtual) where your components live. This approach gives your developer high flexibility and amazing performance gains because React.js calculates what change is needed to be made in the DOM in advance and updates the DOM-trees accordingly. In this way, React.js avoids the costly DOM operations and does updates in an efficient manner.
- Awesome for SEO — One of the major challenges with JavaScript frameworks is, they are not at all search engine friendly. Though there have been some improvements in this area recently, however, that’s not very helpful. Surprisingly, React.js stands out , as you are able to run React.js on the server and the virtual DOM will be returned and rendered to the browser as a regular web page. No need for any other tricks!
- Downward data binding which means that with this kind of data flow the child elements cannot affect parent data. Due to this, you will always be aware of a place where your data changes.
- Absolutely light-weight because the data performing on the front-end can be easily represented on the server side simultaneously.
- Migrating between versions is generally very easy, with Facebook providing “codemods” to automate much of the process.
React.js embeds HTML into JavaScript, while others continue putting JS into HTML.
Drawbacks of ReactJS
- Comparing react vs angular performance, first of all it’s worth mentioning that reactJS is not a full-scale framework and for this very reason integration of the UI library into a common MVC framework requires deeper programming knowledge.
- Lack of official documentation — super-fast development of ReactJS leaves no place for proper documentation which is a bit chaotic now as many developers contribute it individually without any systematic approach;
- React is unopinionated — meaning that developers sometimes have too much choice (I love this);
- Long time to master which means that React JS requires deep knowledge of how to integrate user interface into MVC framework.
Companies that use ReactJS: Facebook, Instagram, Netflix, New York Times, Yahoo, Khan Academy, Whatsapp, Codecademy, Dropbox, Airbnb, Asana, Atlassian, Intercom, Microsoft, my future websites too.
Why choose Angular?
Angular JS is leading in most countries, including Taiwan, Russia, Germany, India and 109 other countries.
Angular JS is leading in Business & Industry, Travel, Sports, Real Estate and 73 other categories.
- Global community support is one of the factors, that can easily make Angular the best JavaScript framework. Developers and designers constantly collaborate and contribute to the community, increasing credibility and reliability of the framework.
- It is a full-fledged framework that can run in any browser or platform. Moreover, it is consistent, overwhelmed with ready-made tools, ng components are robust and quite mature, as contrasted with React.
- Two-way data bind is probably the top feature, as it diffuses the impact after every minor data change and does way with the need for further effort with data sync in view and model.
Drawbacks of Angular
- Migration issues which can appear while moving from the older version to the latest ones.
Companies that use Angular 5: Upwork, Freelancer, Udemy, YouTube, Paypal, Nike, Google, Telegram, Weather, iStockphoto, AWS, Crunchbase.
When Should you use react?
React shines when you have lots of dynamic content changing within the view. Most client-side solutions on the web today struggle with rendering large lists of items within a single view. This “struggle” may be on the order of milliseconds, but in this increasingly digital world, a half a second delay is all it takes to kill your user experience. It’s why sites that have a lot of dynamic, constantly changing, data-intensive content like Instagram or Facebook choose to power their applications with React.
As a library, you can also use React as the view component of AngularJS or other frameworks, because it does not tie you to a specific technology stack. That said, there’s a quickly growing community and a number of existing libraries and add-ons that can help you build an app from scratch. Consider Flux, the application architecture Facebook uses to create an application powered by React. React is also perfect for those familiar with ClojureScript and its immutable data structures — the Om project is the rising star for those looking to build dynamic applications using these technologies.
You should choose Angular JS if…
Development time is at a premium, and you need a full, comprehensive framework that will get you running quickly out of the box. As we mentioned earlier, comparing a library to a framework isn’t really a valid question, as you can always use one with the other.
The real question to ask is when shouldn’t you use React? React is not backwards compatible with browsers older than IE8. Also, the community is young, so it’s possible you’ll have to do a lot of “reinventing of the wheel” in order to get the specific features you’re looking for. It’s also up for debate whether or not installing React is worth the trouble if your project is either a simple webpage or if AngularJS is already more than capable of rendering your view.
With the recent release of Angular 2.0 on May 2, 2016, Angular devotees have another reason to stick with their framework of choice. Angular 2.0 shipped with a huge performance boost, including support for server-side rendering and a similar approach to using one-way data binding to only manipulate the parts of the DOM that need to be changed. However, Angular 2.0 also involved a major rewrite of the framework, so whether you choose to install React or upgrade to the next generation of Angular, there’s still going to be a learning curve to overcome.
What should I choose?
If you love object-orientated-programming (OOP): Angular
If you need guidance, structure and a helping hand: Angular
If you like flexibility: React
If you love big ecosystems: React
If you like choosing among dozens of packages: React
If you love JS & the “everything-is-Javascript-approach”: React
If your app tends to get really large: Angular (or React)
If you want to build an app with react-native: React
If you want to have a lot of developers in the pool: Angular or React
If you can’t decide, first learn React, then Angular.
If you are wondering what I would choose: React
A little bit of debate: Don’t compare Apples to Oranges. Why i use React.
I meant no harm in both ecosystems, and probably let’s just say that it’s easier to integrate new features in React than Angular because React is a library and Angular is a Framework.
When you’re using a library, it’s just one part of your application. So obviously the learning curve is small as well, and you can blend in some other libraries you might wanna use.
Framework, on the other hand is big. And you are to adhere with their standard way of doing things (such as doing HTTP requests, component bindings, event bindings and so on). In short, you are constrained to do everything their way. In the case of Angular, you need to do things the “Angular” way. Everything! It doesn’t matter how tricky it is to bend in their way, you have to follow it since you’re using a framework.