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 + 搜尋友好, 輕巧高效。