AngularJS vs ReactJS

Question

I am deciding which JavaScript framework to use for my new web application. I wanted to use Angular, but recently heard about React. The problem is - I have not found a really good comparison between the both. Most of the articles which do a comparison are "pro-react", and are not a big help comparing, but only showing why react is better. e.g.

https://www.codementor.io/reactjs/tutorial/react-vs-angularjs http://www.quora.com/Pete-Hunt/Posts/Facebooks-React-vs-AngularJS-A-Closer-Look

Any real experience, or comparison which states the pros and cons of both? Thanks for your input

UPDATE - Maybe a small example would help, how to do the same in both frameworks and compare the pros/cons

Example: I have list of companies in a table. Each row is 1 company, each column is some info about the company (name, address, number of employees..) There are a lot of entries, and I need to do some paging and sorting (server side)

Solution

I have a reasonable experience with React, and basically none with Angular. So what I'm going to say about Angular is from things I read and heard from other people.

React

Pros

1. Easy to learn
2. Isolated components are easier to maintain
3. The "Always Re-render" way of React is nice to keep it easier to understand when things get complex
4. Flux is a really good alternative to the MVC pattern. The one-way data flow helps with maintainability and keeping data and DOM elements consistent. Combined with Immutable.JS data structures, it's the cherry on top of the cake :)

Cons

1. Doesn't play nice with DOM manipulation libs (e.g.: jQuery)
2. It really changes the way you do things, particularly if you're using Flux, which is good, but it takes a little getting used to.
3. I found some cases where the re-rendering every time slows down the app when the components handle a large dataset on the render method. Optimising performance in these cases can get a little bit tricky.

Angular

Pros

1. Good documentation
2. Members of the community are helpful (it's easy to find good answers here on SO).
3. Two-way data binding makes some things really easy to implement

Cons

1. Performance issues: To make two-way data binding it has to check for changes in your data model. It also has to parse your HTML to make it's magic work. This slows things down, and, if the app is running on a mobile device, it drains the battery faster
2. Logic in spread across HTML and JS: code harder to understand, maintain and debug.
3. v2 coming to fix some issues, but making all v1 code obsolete

Comments

[Dmitry Pavlov]

Angular vs. React: Which Is Better for Web Development? - toptal.com/front-end/…

[Brigand]

Good answer, I've been using both React and Angular for about a year, one thing I'd like to add is that I would never choose Angular over React, but if you take a few random developers with no React experience and need to start working right away, React takes too long to learn to be practical. Also, Ember is a better version of Angular... from what I hear. Learn React in your free time, and use it on the next project, or some internal tools for your company.

[Breno Ferreira]

Yes, it's always better to learn it on your own, and then start on something small.

[Kamil Kiełczewski]

Separtaion HTML and JS make code harder to understand mainatin and debug? Bull shit. In reality that separation is a good practice "to not mix html with js" - and also it make project very clear and easy to understand. Model-View-Controler - html angular template is view, js angular component is controller, and also angular have model part (models + services)