ReactJS和AngularJS對比

Angular的特色：

優點:

AngularJS是一套完整的框架，angular有自帶的數據綁定、render渲染、angularUI庫,過濾器,$filter,$directive(模板),$service(服務), $q(defer),$route, $http，$cookie, $inject(依賴注入),factory,provider……，等等一系列工具，基本上只要你在作web開發用過的東西，它都有一個。可是這些東西react自身都沒有。

Angularjs的架構清晰，分工明確，擴展性良好，model，view，controller誰在何時作什麼事情說的很清楚，angular可以讓程序員真正專一於業務邏輯，對js能力要求也不高（基本上只須要寫業務邏輯，實在用不上那些高級的js技巧和知識呀），並且由於對html侵入不大，很是易於和designer協做。整個框架充滿了DI的思路，耦合性很是低，對象都是被inject的，也就是說每一個對象均可以輕易被替換而不影響其餘對象。

Angular採用的是MVVM模式，真正將頁面和數據邏輯分離，只要在模版中聲明視圖組件是和什麼狀態進行綁定的，雙向綁定引擎就會在狀態更新的時候自動更新視圖。

MVVM和MVC惟一的區別是，它採用雙向綁定（data-binding）：View的變更，自動反映在 ViewModel，反之亦然。

 

Angular生產效率高，單向數據流什麼的想法很是好，可是寫起來太麻煩！我只想變動個很簡單的數據還要通過action、dispatcher、store、view四步，angular裏一行代碼就搞定的事情在react裏卻如此麻煩

Angular的背後是Google，因此社區基礎是不用擔憂的，整個生態也已是很是的完整了，從最基本的Tutorial到StackOverflow的問題數到框架自己的剖析都很是多，Angular上手比較容易。

劣勢:

1. 性能 
一樣是TODO MVC的Sample，Angular徹底載入用了1.1s（WebPagetest - Visual Comparison）。React只用了0.3s,不得不說，確實挺慢的。。
2. Angular 2.0推翻重作使得目前不宜採用此框架

Angular 1.x版本實際上是個比較舊的東西了，如今看來有些理念過期了，好比依賴注入、本身獨特的模塊化，這些東西其實在ES6下已經很好地被解決了。

Angular的2.0幾乎是一個推翻重作的框架，估計不會有1.X的upgrade方案。因此若是如今新開始的項目採用Angular的話，會是一個很尷尬的時機。一樣，如此大的改動彷佛也反面印證了1.X並非那麼好。

 

React的特色：

優點:

1.React偉大之處就在於，提出了Virtual Dom這種新穎的思路，而且這種思路衍生出了React Native，有可能會統一Web/Native開發。在性能方面，因爲運用了Virtual Dom技術，Reactjs只在調用setState的時候會更新dom，並且仍是先更新Virtual Dom，而後和實際Dom比較，最後再更新實際Dom。這個過程比起Angularjs的bind方式來講，一是更新dom的次數少，二是更新dom的內容少，速度確定快。關於對Virtual Dom的理解，請查看另外一篇博文。

2.ReactJS更關注UI的組件化，和數據的單向更新，2014提出了FLUX架構的新概念，2015年Redux出現，將 Flux 與函數式編程結合一塊兒，很短期內就成爲了最熱門的前端架構。如今React能夠直接用Js ES6語法了，而後經過webpack編譯成瀏覽器兼容的ES5，開發效率上有些優點.

React Native生成的App不是運行在WebView上，而是系統原生的UI，React經過jsx生成系統原生的UI，iOS和Android的React UI組件仍是比較類似的，大量代碼能夠複用

3.維護UI的狀態,Angular 裏面使用的是 $scope，在 React 裏面使用的是 this.setState。 而 React 的好處在於，它更簡單直觀。全部的狀態改變都只有惟一一個入口 this.setState()，Angular 就比較複雜，不知道背後使用了哪些黑魔法。

 

劣勢:

React是目標是UI組件，一般能夠和其它框架組合使用，目前並不適合單獨作一個完整的框架。React 即便配上 Flux 的組合，也不能稱之一個完整的框架，好比你想用Promise化的AJAX？對不起沒有，本身找現成的庫去。並且第三方組件遠遠不如Angular多。目前在大的穩定的項目上採用React的，我也就只知道有Yahoo的Email。React自己只是一個V而已，因此若是是大型項目想要一套完整的框架的話，也許還須要引入Flux和route相關的東西。而Angular在這方面提供的東西比React多多了.

 

如何選擇？

Angular是真正的大而全的Framework，它有一套生態體系和思路，基本你按照它的思路往裏面填代碼就OK。
React是一個簡短有力的library，它只負責解決你某個單一的「痛點」。

開發大項目或者比較正規的項目,建議使用Angular，angular 是最適合CRUD的SPA 單頁面的應用程序。 和 angularUI 一塊兒使用就能夠搭建還不錯的web app.

yeoman+bower+gulp能夠很快的把架子搭起來,終歸比較簡單實用。

對於移動端，React比Angular更有潛力, reactjs的模塊化 + vdom + 搜索友好, 輕巧高效。