Why Not Angular Js ?
With two way binding
and dirty checking in Angular js, users do experience dis-ruption. It
works like this.After page load, the DOM elements marked by the ng-app
directive is scanned. Each of the DOM elements has a listener
function(java script function) bound to it. If the javascript function
modifies the DOM (which you will do), again the re-scanning, re-bounding
to js functions...in short dirty checking happens.
It is good for
web applications that have fixed set of DOM elements, however if the
number of DOM elements that are manipulated increases, Time to consider "Right Tool For The Right Job"
Why React Js ?
React
Js is class based and application overrides the render function of the
React class. Each React Class can compose an other class by Calling
<Todo /> etc..
Then comes the virtual DOM. All these
components are applied by react and a virtual DOM is computed. React's
internal algorithm, diffs the computed VIRTUAL HTML DOM with the
existing HTML DOM , and applies the changes alone. Also with class based
overriding, there is more precise control, over what behavior we want
to override.
Why Not Both ?
Yes. Of course. Use Angular js on DOM elements that interact with server, but do not get changed.
Surround only those with the ng-app directive. Then use ReactJs for say showing a lot of UI menu items, that get loaded from the server.
Why Only Two ?
Yes Of Course. You do not have to stop with two. You can use more than one framework. If you do take this approach, please follow the following guidelines,
1. Use libraries/tool kits , instead of frameworks.
Frameworks have a larger foot print on the code, and your code is called by the framework.
Libraries provide functionality and the application invokes the library.
2. Organize. No Excuse.
Do write large pages, large java scripts or large anything. Organize your pages in to plain html and Js components. Use applicable design patterns with in js and import the as needed, wisely.
3. Switch Vs Stick With it.
Frog in the pond story applies. Know when to adapt your existing choice and know when to switch.
Pick libraries that play well with other libraries each time. "Feature Rich" tool kits are deceitful choices , rather tool kits that do one only one thing , very well are better choices.
To illustrate, If your requirement is to use just two way binding, then knockout.js is a better choice..
Not that Angular.js or React.js is bad, they are just an over kill for simple two way bindings.