Angular2 相比 React 技術棧有什麼具體的優勢?

「React 技術棧」,不是「React」。

奇怪的模板相比 JSX 有什麼優勢嗎?據說 Google 為了編輯器支持還特製了一個解析器。

Rx?TS?這些貌似是通用的。

依賴注入?然而 React 是函數式的。

剩下還有什麼?性能、大小的優勢?


不談具體項目講哪個有優勢純屬耍流氓。

你的項目是遍地CURD的「企業級」系統?當然ng2有技術優勢:

  • 滿地都是form,每個form有茫茫多的欄位,雙向綁定是你的好朋友,自帶的表單驗證機制是你的好朋友
  • 因為你從頭到尾90%的時間是做在CURD和高級一點的CURD,為了放置無處安放的CURD代碼和方便的調用這些代碼,你寫了無數個Service而且他們之間還互相依賴,依賴注入是你的好朋友
  • 什麼都有,什麼都有現成的模式,就像java一樣,充分的降低對程序員技術的要求,程序員可以專心搬磚,不用想太多。

你的項目界面簡單,但是交互經過精心設計?各種點了改,各種互相拖拽,各種別人家看不到的自定義界面?當然react有技術優勢:

  • 不存在form這種東西,只存在零散分布於各處的可以用不同操作方式改變狀態的組件,不存在模式化的表單驗證這種東西。可以無限組合的stateless function是你的好朋友。
  • 你從頭到尾都在倒騰把組件塞到不同的地方,並且讓他們之間無限聯動又不能出bug。可以無限組合的stateless function是你的好朋友。
  • 沒有現成的模式可以借鑒,因為你要的效果就是你的項目做完發推帶個gif就一堆人膜拜。基本所有組件都要自己擼。自己擼的話當然自己喜歡哪個lib就用哪個,做個項目不帶100個依賴說明太玩具。然後你欺騙自己沒有在搬磚。:P

所以反正是搬磚,別比來比去覺得別人傻x了,老老實實都學了,看具體項目選擇使用吧。

============================================================

2017/04/02 更新

出乎意料得到了這麼多贊,看來很多同學想法和我不謀而合。

匿名是因為這個回答純屬一時興起,跑來黑一黑一直以來的自己:

遇到ng1的時候,我到處宣揚jQuery太落後了,我們有jqLite就是為了幹掉jQuery。

遇到React的時候,我到處宣揚ng1太落後了,狂黑ng1的性能和圍繞$scope的一些設計缺陷。

遇到Vue的時候,我到處宣揚React太死板了,不允許任何的魔法,而Vue有恰到好處,精心設計的魔法。

遇到Elm的時候,我到處宣揚React的Redux是抄襲者,Vue過於動態,狂黑因為沒有tagged union+pattern match,redux和vuex用起來都很醜。

。。。

直到有一天我一個人負責了一個巨型的項目,既有茫茫多的CURD,又有狀態複雜的特殊界面。這個項目前端是用react + nuclear.js(那時還沒有redux)寫的。我發現寫的過程中,我在寫CURD時懷念雙向綁定,寫onChange/value寫的想砸鍵盤。在寫狀態複雜的界面時讚歎React+Nuclear.js組合純函數+外置state簡直是神器,避免了無數個bug。在代碼堆成山的時候會想如果我用的是強類型的Elm是不是可以避免90%的低級錯誤?

完成這個項目之後,我再也不會去捧或黑了。設計是優雅還是愚蠢,其實取決於使用場景。你用的每個框架都有秒殺別人的地方,也都會有用起來很傻的狀況。


看到被人轉到了朋友圈,還是認真回答一下吧,光這麼吐槽題主的「傾向性提問」也不太厚道。當然,我不是React專家,因此這裡說Angular的優點不代表它就是React的缺點,請自行對照。

==============2017-03-31===========

首先請移步 我為什麼選擇Angular 2? 這是我2016.07在InfoQ發表的文章,其中論點至今仍然適用。

接下來我再更新一些新狀況:

1. 工具更加完善、簡單了。

AngularJS(1)的時候沒有官方CLI,而Angular現在有一個專門的開發組負責開發維護CLI。現在的CLI已經相當完善,推出了正式版,可以在正式項目中使用了。代碼質量的標準和Angular看齊,很容易理解和進行定製化開發,並且,可以期待這種版本迭代還會持續向前演進。

通過CLI,你可以創建、開發、測試、構建項目,而不需要額外的依賴。它封裝了實現細節,如果是新手,你完全不需要懂Webpack,也不需要自己寫構建腳本。現在,你要嘗試Angular,只需要執行下列命令:

```

cnpm i -g @angular/cli

ng new YourProjectName

cd YourProjectName

ng serve

```

然後就可以打開IDE,開始「編輯、保存、查看結果」的開發循環了。

Just do IT。

2. 更有利於分工

在Angular中,模板、樣式、組件代碼、服務等都是明確分開的。

如果你有豐富的項目經驗,就會發現要做好它們所需的技能和等級是截然不同的:樣式需要精通CSS,服務需要豐富的設計經驗和架構觀。如果不能分工又沒有足夠敏捷的項目管理,那就意味著,每個團隊成員的技能缺陷會體現在他/她實現的功能點中。

而分開之後,精通某項技能的人可以去做專項增強,而不用擔心意外影響到別人(都不在同一個文件里),甚至可以打通前後端,把服務交給實現API的後端程序員來寫(TypeScript不要太眼熟!)。

3. 天花板較高。

Angular入門很簡單,特別是對於後端程序員,但成為專家並不容易,有著廣闊的成長空間,不會出現用兩周後就發現沒得可玩或者每天的工作就是找輪子或造輪子的情況。

同時,由於架構模式、語言等層面的特點,後端領域對你是敞開的,比如依賴注入,對於後端來說有多重要就不用說了吧。程序員路線上,要想到達高端崗位,前後端通吃是遲早的事,Angular讓你可以自然而然的切入全棧。

4. 嚴謹的版本發布計劃。

我是認真的。我知道你還在心裡吐槽「重新定義了RC、跳過3.0」之類的事情,但那都是過去式了。現在及以後,Angular開發團隊將遵循嚴格的語義化版本方式進行發布,摘譯文章參見 Angular 的版本號與發布周期 。如果你不擔心Node的版本發布周期,也沒必要擔心Angular的。就個人感覺來說,相對於Node,Angular的變更管理還要更保守一點。

Angular的這種發布策略,可以兼顧技術更新與向後兼容,是相當友好的發布策略。否則就像AngularJS(1)一樣連續六年都沒有技術的更新換代,突然出個大幅變更的Angular,你樂意嗎?在可以預見的未來不會再出現這種情況了。

很多次小的更改總比突然一次大的更改友好一點。如果你是有經驗的CTO,那麼你會愛上這種定時的、可預測的、整體性的更新方式的。

通過使用這種發布策略,Angular在將來可以安全的不斷引入新技術,保持和業界最新的進展同步。

5. 官方的風格指南

通過官方的風格指南,Angular開發組給出了一組最佳實踐,這可能是保證新手也能寫出好代碼的最有效措施了。

而這些最佳實踐是官方開發組在迄今三年的Angular開發過程中逐步總結出來的,含金量可想而知。對於新手、中手,理解並遵循最佳實踐是提高自身水平的終南捷徑。即使對於高手,理解其原理並推而廣之,也可以得到很多啟發。

6. 降低門檻、簡化開發

作為一個AngularJS(1)的資深開發者和Angular(2+)的早鳥,我可以保證Angular比AngularJS簡單多了,並不是因為我有AngularJS的基礎。事實上,我曾幫助一個只有一年NodeJS開發經驗的程序員在一周內能獨立用Angular開發,一個月的項目結束後達到了Angular的中下級水平(主觀估計)。

用數字來說明一下吧,AngularJS(1)中有70多個內置指令,而Angular(2+)中只有20多個,但是能實現的功能比以前卻多了很多,因為新的綁定語法取代了以前的50多個內置指令和大量第三方指令。

先寫這麼多吧,想起來再補充。

=====================原答案的分割線=================

—————— 奇怪的模板相比 JSX 有什麼優勢嗎?據說 Google 為了編輯器支持還特製了一個解析器。

奇怪的是jsx吧……我在十八年前就學會不要把界面代碼和邏輯代碼寫在一起了,如果沒有redux、flux這些,你寫個稍大的工程就崩了。所以實際上成功的是flux這些數據架構以及獨立數據流的模式,正如另一位答主所說,react只是view。而如果以前的代碼中的redux寫得比較純凈,那麼也很容易遷移到Angular。Angular現在明確推薦在大項目中獨立設計數據架構了。實際上在AngularJS 1的時代我就已經這樣做了,說到底,這是個最佳實踐的問題,而不是框架本身的問題。

正如你所說,之所以現在各大ide對Angular的支持相當完善,是和開發組為此專門付出的努力分不開的。

—————— Rx?TS?這些貌似是通用的。

兩年半之前Angular開始採用ts,翻翻歷史看看Angular採用ts前ts的影響力如何。ts這兩年的快速成熟和angular的需求驅動是分不開的(至今ts首頁還把Angular列為第一合作夥伴)。rxjs也類似。當然,這是雙贏的合作,並不需要爭功。我要表達的意思是:如果想學這兩項技術,那麼最快的方式當然是通過Angular學了,Angular開發組本身就在這兩方面有豐富的實戰經驗。

—————— 依賴注入?然而 React 是函數式的。

1. 函數式不是聖經,如果你把函數式作為最高標準,那你應該去學scala.js/binding.scala,用完之後你就會發現由於js的先天不足,react的函數式充其量只是個水貨。
2. Angular並不排斥函數式,事實上rxjs就是函數式編程領域的重量級選手。rxjs兼具靈活性和可讀性,而Angular和它整合的很好(但不強依賴)。

———— 剩下還有什麼?性能、大小的優勢?

性能方面有評測數據,各有優勢,平均來說在同一個級別(實際上有好幾個常見場景是Angular更快)。大小方面沒辦法直接比較,但如果比全家桶的話,最新版本Angular的aot編譯結果通常會比全家桶小。

不過說實話,拋開應用場景談速度和大小就是耍流氓。大多數場景下,沒有人在乎20k的大小差異或者50ms的速度差異。所以Angular雖然大幅度提速,但是很少拿來作為宣傳的亮點,任何情況下都是可讀性和可維護性優先。


誰也不比誰容易,但誰也不比誰更難。

如果一定要說優勢,個人覺得基於ZoneJS的Change Detection比Virtual DOM的更簡單,不是說理解起來更簡單,而是從解決問題的角度,ZoneJS是一種更簡單的方案。Virtual DOM基本上對開發者是不可見的,而NgZone的價值可能還沒有被完全認識到。

另外一方面,談不上框架或者庫本身的優勢,但是Google和Facebook的不同,是Google控制瀏覽器(Chrome),佔有相當的市場份額。所以Google往往能從系統的角度來解決問題。在我看來整個React棧是Facebook作為一個應用開發團隊通過各種Hack搞出來的,只不過它是Facebook,它做的Hack大家都覺得很牛逼。但實際上Redux這樣的東西,本質上也就是一個PubSub(Observer)的架構,類似的結構在許多項目里早就被用了很多了。

總的來說,Angular 2對於Component的抽象更規整,對於快速開發應該是最有利的,Component Service一分,用DI來管理模塊依賴。如果全平台能搞好,未來可能是最光譜廣譜的框架。

一個系統的架構最終只有兩個問題,一是模塊化是如何實現的,二是模塊之間是如何通信的。這兩個問題決定了一個架構的品質,我認為Angular 2更勝一籌。


我感覺是整體性、統一性、規範性比react要好,react需要和很多其它庫配合,每個人的喜好和風格不太一樣,然後就出現類似linux碎片化的問題


為什麼不是React?? · Angular2 Training 中文版

翻譯水平一般可以參考英文原文:https://blog.biznas.io/why-we-chose-angular-2-over-react-for-our-enterprise-software-development-work-392e2c9e39a9

以下為部分節選:

為什麼 Angular 更好?

我們的客戶主要是希望從開源獲益的大型企業。 當選擇軟體時,他們通過以下方式降低風險:

  • 技術一致性
  • 社區支持
  • 清晰的最佳實踐
  • 最小未知

他們有數百萬的用戶,以及數百萬或數十億美元,受他們管理的軟體影響。 這些決定是至關重要的,有時甚至關乎生死。

他們還堅持使用一種技術很長時間,需要一致性,清晰的最佳實踐和最小未知。

必須降低技術風險,以允許企業利用開源的力量,並從開源社區提供的驚人的工作中獲益。

......

React

  • 大量社區追隨者,會有大量人才儲備。
  • 更少標準化/更多培訓 - 由於技術的開放性開發者將以自己的方式構建。

Angular

  • 大量社區追隨者,會有大量人才儲備。
  • 上手簡單 - 開發人員將遵循類似的最佳實踐。
  • 標準化 - Google撰寫了如何使用框架的最佳實踐。


4.4更新小廣告:

Po個我司Tech radar對於前端框架的接納程度,可能有點參考意義:

Technology Radar | Emerging Technology Trends for 2017 | ThoughtWorks

這個radar反映了ThoughtWorks全球所有office在這一段時間內對技術的總結,反映了各個大小項目對特定技術的態度,基本上所有主流的工具我們都有很多項目在用,當然包括Angular 2和React。我們說說前端框架方面:

1. Ember和Redux長期穩定處於Adopt階段,也就是說我們在這兩個框架上有大量實踐,並一直有非常良好的反饋。

Ember:

Our teams praise Ember for its highly productive developer experience, with far fewer surprises than other frameworks such as AngularJS.

Redux:

Redux, with its three principles of restrictions for updating state, has proven to be invaluable in a number of projects we have implemented.

2. Vue在它們之後處於Trail階段,也就是我們覺得這個技術還是相當不錯的,也非常有潛力,並且對新手非常友好,也不像Angular 1一樣那麼Opinionated:

It has a low learning curve, which makes it interesting for less experienced developers and beginners.

3. 對於Angular 2,它剛剛進入Access階段,雖然有些項目早就已經開始使用了。跟上面三個競爭者相比,我們對它還是有一些猶豫,(其實內部也有一些爭論):

Given the, in our experience, superior contenders such as React.js, Ember.js and Vue.js, we"re still hesitant to give Angular 2 a strong recommendation.

所以這個問題可能放寬一點比較好,我覺得Angular 2的問題不在於比React好在哪,而在於比擴展性比不過Redux,比簡單實用又比不過Vue,實際算下來定位有點尷尬。樓上很多都舉表單CRUD的例子,這時候再把Vue加進來你們怎麼說呢?

------------

4.3更新,吐槽樓上某些內容:

1. 吐槽題主說DI和FP的:我覺得樓主的意思是React用HOC實現DI,更好一些。有點像Reader monad或者Arrow注入上下文。本來ES6就是一大堆類似閉包的靜態模塊,你寫的每個module其實都是個單例,Angular用的經典IOC風格的DI很大程度又在上面重新造了輪子,而且這種DI本來就很笨,有可能沒注入掛掉,也不像HOC一樣簡單。

2. 樓上說Rx是函數式的,而且還很叼地呵呵一下。Rx是函數式的,但是Angular並沒有函數式地使用Rx。就跟普通人平常Promise resolve之後賦值一樣,跟函數式沒半毛錢關係。想像一下你在Angular里寫一個可以重置的counter stream,第一反應不會是用switchMap吧……Rx在Angular中起到的主要只是類似binding.scala的綁定作用,而不是鼓勵你耍函數式飛起,它們之間的範式不是特別合得來。

3. 我覺得看到這種問題表明態度說出偏好和理由是正常的。反而很多人跳出來說幾條主觀的「更適合人類閱讀」,「更適合企業級開發」,還教育別人說:「脫離實際場景的討論都是耍流氓」:

第一,不同工具適合不同場景,作為一個工程師我覺得每個人都知道這點,不用這些人一遍一遍出來複述,這句話沒任何乾貨,這話現在反而變成和稀泥的套話,最後導致所有工具都分不出個高下,真巧。

關公戰秦瓊不是說關公和秦瓊恰巧一樣強,試問關公跟劉羅鍋肉搏,大家覺得誰會贏?

第二,我們是討論General Purpose的前端框架,每種框架的有一定的專精面,但是它們的專精面大小不是一樣的,但它們的目標是滿足更多Web場景,畢竟大家寫的網站功能特別單一的很少,畢竟不是後端寫Domain layer,而且如果這麼簡單也沒必要用這兩個框架,我覺得用Vue用jQuery或者乾脆後端MVC就好。

我想,如果不是比Angular和React,而是ExtJS和React這種就高下立判了吧,他們適用面的寬窄就是不同的,而不是某個框架就固定在某幾個方面更出彩。

第三,就企業級開發常用的表單雙向綁定而言,Angular跟現在的Redux Form比優勢很小,函數式畢竟抽象方面更擅長一些,哪裡不足就搞個更好的lib抹平就好了。一個Field組件一個reduxForm HOC基本就是你要記的所有API了,還不算數據共享的好處。

-------------

總得來說,沒啥優勢。

先說說工程的:

我覺得Angular優勢就是一站式全家桶。你用Angular就不用考慮每個東西用啥,直接學就好了。

劣勢也是這點,Lock-In。項目寫了兩年碰到問題跑不了。我們5年的Angular 1項目路上各種問題都得跟框架定死的東西做鬥爭,時間越長,讓你鬱悶的事越多,但是老闆不決定忍痛換你就只能忍著。

React你想換掉哪個地方都是很簡單的,每個相關領域的庫也都只有幾個API,所以你的前端架構可以漸進演化。

所以假如你是個Java或者C#程序員選Angular可能前一年爽,後面就蛋疼這種。至於挖坑第一年爽這種事算不算優勢就見仁見智了。

我感覺很多引入Angular 2的項目都是想嘗試TS和Rx的,希望從中學習更多東西,而從不是直接對項目的有效產出出發的(僅猜測,但是用Angular 2的項目的可以試著對號入座)。

所以React的劣勢是你要「自己組裝電腦」。一旦你明白怎麼組裝電腦,你就可以嘲笑那些天天抱怨自己台式機不好用的人了。

再說說代碼上的:

我覺得Angular沒啥優勢。Angular學習成本高,API太多,體積大,速度慢。

我見過一天學會React,第二天學會Router,第三天學會Redux的……一周就解決所有Case的,大部分時候都不用回去查API文檔,這是常見情況。

我就沒見過用Angular 2一周就敢說不看文檔的,就算以前Java和JS都寫。

React並不是吹半天華而不實的函數式編程,它是簡單實用的library。往更深層的方向走,React的API比較類似Unix風格的經典設計。

能上油管的可以看下Cheng Lou的這個視頻:https://www.youtube.com/watch?v=mVVNJKv9esE

相比Angular這種Framework式的框架,試著Cover所有的Concrete use case,其實這是不太可能做到的,並且這樣會引入過高層數的抽象,導致難以學習,並且一旦這種Framework不能Cover你的use case時,整個體系就開始崩潰了:想想你在Angular 1裡面用雙向綁定很爽,突然你需要change時間callback其他代碼時,有多彆扭,這種情況比比皆是。不僅如此,很多API甚至都不建立在JS上,想想你學了多少Directive……這對你的JS沒任何幫助。這是Angular在Framework上過度抽象的結果

另外一方面,React還給了缺少抽象的方面至少一層薄抽象:把HTML和CSS都變成JS對象是非常重要的。HTML和CSS是聲明式的,這很好。但它們並沒有Dry的能力。因此任何一個規模正常的項目,HTML和CSS都到處重複,難以維護。很多Framework並沒有給HTML和CSS簡單,低成本的抽象方式:

比如HTML

const Greet = ({ name }) =&> &Hi, { name }& const Result = &

比如CSS

const centeredPlaceholder = ({ flex }) =&> ({ alignSelf: "center", flex })
const compStyle = ({ color: "red", ...centeredPlaceholder(1) })

相比於Angular在不同case下不均勻的抽象,React試圖拋棄過厚的抽象,並給缺少抽象的方面建立簡單好用的抽象,並且抽象都是建立在JavaScript上的。

另外比如說像React-Router的演化:

React-Router以前是一個「還行」的library,它的功能比較正交,但正交還不是最好的情況,這場很多互動都變得困難。經過長時間的反饋,現在React-Router復用了更多的React本身的機制。讓API更少的侵入,用起來跟容易,並且更通用:以前切換路由要同時替換兩個組件簡直鬱悶,說真的,現在幾乎所有的前端框架都是用這種用router view替換children的方法實現的。React-Router v4乾脆將Router和渲染本身合起來,這已經超越了正交設計的層次了,這種設計更能無縫結合,但這是無數經驗得來的,因為React libraries跟容易替換,社區也可以輕鬆跟進——Angular想做同樣的Breaking change基本上每次都要見血。總得來說React社區,已經在「第一世界煩惱」的階段了:第三世界的人永遠不知道為什麼第一世界的人因為杯子下面有水這麼生氣。

React更像Library,在View上用React,在Data上用Redux,在History上用React-Router等等。你在建立Project的時候多花了幾十行來設置它們,這給了你在這個體系不成立時修改它們的關係,乃至扔掉它們任何一個的能力。React不試著Cover你的Use case,這樣你有控制權,React社區也可以持續增長,因此React每年都變得更好更強。假如你現在認為Angular和React差不多,兩年之後它一定被React甩在後面。如果你經歷過10年前的Rails社區,React社區在很大程度上也有那種熱情和創造力。


就我的開發體驗來說說吧,react其實是只做view的,很多初學者會發現自己學會了react卻什麼也寫不出來。其實區別就在這裡,現在我們說react一般都說的是react全家桶,一般需要配合react-router redux axios webpack css-module和其他一系列東西才可以幹事,在這一點上和vue,express或者koa很相似,都是需要配合一系列的插件/中間件甚至很多第三方npm包才可以完成一個工程。這類框架一般小而美,需要使用者有全局把握,充分了解全家桶中的軟體包,使用起來靈活,但也容易被亂用。

angular2相對來說整體非常完整和統一,基本前端一個angular2就可以通吃一切,官方包有路由包router ajax包http 就連動畫都有animations包 整個框架都是基於DI注入的,可以說結構上非常完整和成熟,相對來說不容易勿用,對新手友好一點,但是缺點也就是不靈活。

另外就是angular2推薦的ts,這個算是比較有爭議的,有人覺得ts太啰嗦,有人覺得ts能較好的控制代碼質量,就這點來說,我比較傾向於使用ts來完成項目,畢竟以前我是做java的,ts還是有些親切的。至少使用ts在我這算是優點。

點贊加關注,乾貨持續分享中

~~~~~~~~~~~2017/3/29更新~~~~~~~~~~~~~~~~

看到題目被修改了,懷疑提問者帶有很強的偏見來提問的(或許提問者的意思就angular2就是沒什麼比react好的)。這要是前幾年年輕氣盛,免不了一頓口水戰了。現在倒是看開了,別人用什麼,覺得框架好或者壞跟我有什麼關係,我用我的順手就行了。

react我最近也在用,angular2我是從alpha.37就開始用,一路上大大小小的坑都踩過,兩個框架互相取代性還是挺大的。題主覺得react好,自己用唄,我也沒說react不好。但是別人也有用angular2的權利。


ng2 是嚴格的後端模式哈,如果你寫過 java 類估計很快就上手了,並沒有某些看了還沒動手的小夥伴說的那麼難,總體我覺得比 ng1 要簡單,react 那邊其實用起來也沒想像中美好,但是純 js 的語法還是很自由,我喜歡自由的寫,所以當初也主要學的 react 技術棧,這個圈子的工程氛圍很不錯,不像 vue 那邊經常說因為簡單上手快撒的討論半天沒撒意義,大多還是有研究精神的,不然估計很多就半路轉了。反正挺喜歡這兩者的,目前 ng2 沒寫過大項目不做評價。不過這都是兩個方向的領航者。

雪狼叔他們應該經驗比較多,多年老碼農了,其實軟體開發一直還是坑點都在,就看處理的好否。


其實不管優點如「一套完備解決方案」,還是缺點如「編譯體積較大」,都無法體現出Angular跟React的優劣,因為脫離了業務場景。剩下的就只有按個人偏好扯來扯去,還沒個結果。

我覺得最大的優勢就是針對Java程序員,Angular有一種天然親切感。跟React相比,這是一個很大不同。


解放思想,實事求是。

用Angular你不需要看到那麼多人吹「虛擬dom性能比原生高」或者「函數式編程就是好,redux高大上」之類的東西。大部分ng2的開發者就算手頭上用的是rxjs也沒有去找人吹逼。

簡單來說就是,Angular能力不弱,開發思路更符合人類思維邏輯,有中文文檔,有官方規定好的整個社區都在用的最佳實踐,提高工作效率。沒有人跳出來一邊用著狀態機一邊和你吹函數式好好好。


沒用過ng2…只用過react系列…

reflux+react

redux+react 都用過了…

signles immutable 什麼的也用過了…

哦,我之前是做php的…

只能說…單向數據流比較簡單…

不過太靈活了…

程序設計太依賴程序員的能力了…

(?????)想怎麼寫就怎麼寫…


至今都沒覺得react有任何優點,如果你對前端各種框架非常熟悉,自然就會覺得angular比其他的好很多, angular有一些問題,但相比react沒有任何優點處處是問題好多了。

Angular

1 雙向綁定提高開發效率。 如果jQuery的代碼量是100%, 用angular1寫的同樣的代碼量只有30%或更少,angular2的代碼量還會在少一點畢竟typerscript是es6超集。 React的代碼量是130%,如果項目複雜後react代碼比jQuery還多很多。

「不能提高效率的框架都是耍流氓!」

當然有人認為react的代碼好維護,如果jQuery+ES6模塊後可能比react更容易維護,這個就是見仁見智的事,但是說好維護是在完全掌握的react各種全家桶基礎上的,相比jQuery的上手難度可想而知。 還有人說angular1的代碼很難維護,是的如果angular1裡面都是jQuery代碼真的很難維護,本來jQuery代碼就有點難維護了,裡面在塞進去一個angular1。

這點不得不佩服react,jQuery插件直接不能用,直接杜絕了濫用的可能,值得學習。

2 體積

angular1的體積不大, angular2 體積太大, react體積也不小。如果做PC端 angular1 或 2 都可以, 如果移動端目前看來只有angular1或jQuery, angular2 和 react這種體積直接抬出場外。不知道angular4 是否能改善這一點,這是angular4的一個重要問題。

3 性能

我覺得前端就沒什麼性能問題,而且前端的性能問題也都不是前端的問題,通過後端的一些手段都可以解決。 這裡必須提一句很多一提到angular1就說性能不好,還有人說是因為angular1導致創業失敗的,我只能說那試試angular2的AOT吧。

4 社區周邊

angular至今都是第一,無論react社區怎麼宣傳,群眾的眼睛是雪亮的,Stack Overflow Developer Survey 2017 angular僅次於node.js 要不也不會有mean stack這個技術棧組合。當然react教徒的狂熱程度是無容置疑的,獲得了Most Loved 的第一。但人類無論什麼時候都要警惕狂熱者。實際上react的開發效率低的令人髮指。從react開發的UI開源組件數量就能看出,實在是太少,就連vue後起之秀的UI組件到處都是,更不要說angular,隨便搜一下angular admin 多的不計其數,mobile UI 也非常多。angular的bootstrap 就有很多個版本,不同小組做的。對比react 的bootstrap 開發了多長時間才搞出來。

5 官方支持

angular1 是google的,angular2是google 和 半個微軟的? react是facebook的。很多人說google搞的東西不靠譜,目前來看前端最靠譜的還是微軟,例如typescript和rxjs,至於facebook 感覺搞得東西都有點像玩具,只是一個跟跑者,領跑者還是微軟和google。

6 學習成本

實際上我覺得一個技術難不難學跟技術本身難不難學完全沒關,主要就是文檔好不好,資源多不多。目前看來如果英文不好,無論是angular2還是react 都是比較難學的,如果英文好,angular2比react容易點,雖然angular2的概念可能更多一些,但官方中文文檔,stackoverflow上的坑隨便搜搜就有答案了,對比react只能去翻一些官方的issue,angular的資源真是太多了,但資源多也有問題,就是很多問題是針對老版本的,所以只要注意一下問題的日期就可以了。

最後想了一下react的還是有優點的,一是大幅提高了前端薪資,二是提出了「前端工程化」這個偽命題大規模招人終於有了理由。

我一直在想為什麼後端這麼多年也沒搞出什麼「後端工程化」而是跑到微服務上面去了,怎麼前端就搞出來一個工程化呢?後來想通了,招人必須有個名頭啊。


背景:用過angular1和react,ng2的話簡單看過文檔。

既然說ng2的優勢,那react的長處就不說了。

1.雙向綁定相對單向數據流的優勢。這一點在表單上表現得明顯。

2.欽定得比較多,適合選擇困難症。

3.我覺得最重要的一點。angular2是用java的那套思路去寫前端。據我的認識java最大的特點就是給你的約束比較多。這樣可以防止新手寫出過爛的代碼。而react技術棧你可以自由發揮的比較多,質量需要看程序員的水平。


都是組件化,都有虛擬DOM,數據流都是單向的……想不出能有什麼了不起的區別。

就連Angular常被人黑的「一體化方案打包的東西太多」,實際上也不存在,因為Angular很多模塊是可以替換的。

非要說優勢的話……React創建項目時需要你自己找一大堆第三方庫拼起來;Angular則是在你創建項目時幫你打包好,然後如果你覺得哪裡不對或者不好,可以選擇自己研究怎麼拆下去,換一個自己想要用的……

但是,你開發React的時候是隔三差五地換router了,還是能迅速把用connect組織起來的react-redux代碼切換到用裝飾器組織起來的mobx上了……?

自由組合=扯淡

Angular2的優勢?

很簡單啊。

不那麼重要的:有zone支持的自動事件監測,可以雙向綁定。(注意,這個和單向數據流不衝突……)

重要的:API看著舒服,我覺得基於類的寫法更符合人類審美觀。


我還是覺得jq好!高效,成熟,穩定!擼起來不要不要的!


跑個題 一切不兼容jq的框架都是垃圾


Angular 相比 React 全家桶最大的優勢就是對使用者素質要求低得多。

不是所有程序員都是 super stars,大部分程序員都是平庸的。Angular 舊時代面向對象的思想,跟 Java 那套東西差不多,是大部分程序員比較熟悉的,相比於FP,OO 的條條框框多一些,這樣也不容易犯錯,你的團隊即使水平不高也能做出不錯的東西。這就是為什麼 Angular 最流行而 React 是 most loved。就像人都喜歡顏好胸大腿長性格好的女人/顏好腿長溫暖多金的男人,但是大部分人最後都是跟平庸的女人/男人結婚,因為駕馭不了啊。


react和ng1, ionic1, ng4都在大小項目里用過. 其實很多東西都類似, 只不過實現方式不同罷了.

但是, IDE對ng4的支持比react好太多了. intellij/webstorm里寫ng4是享受, 各種自動import代碼補全錯誤檢測. react的代碼補全和錯誤檢測都差點, 自動import就一直沒有IDE支持(atom, sublime, vscode, webstorm試過).

但是不得不說ng在國內推廣太差, 導致生態比另外兩家差了十萬八千里, 所以很多地方只能用react, 比如需要antdesign的時候.


學了2天的react,放棄了,/流淚

webpack的各種loader簡直是黑魔法。webpack 1 和2的配置文件簡直。。。。。。

我都沒看到redux那一步,就是用webpack就把我難住了,先想用ant design,發現樣式無法導入,應該是webpack沒有設置對,網上翻出來的基本都是webpack1的,換react-toolbox,結果還是一個css編譯錯誤,好像是toolbox向cssnext遷移,是一個bug。然後我就放棄了,說真的,nodejs的庫依賴比java都恐怖,react第三方依賴真的是良莠不齊,兼容性不好。準備看看angular。


省心


Rx是說Reactive extensions么?

完全不是一個東西 Rx類似一個插件,不是侵入式的


可以一直學習,提高自己


沒有


推薦閱讀:

前端框架有哪些典型問題?
很迷茫,不知道自己現在是要繼續學習 React.js 還是系統地學習 JS?
公司團隊有自己專職的UI設計師,但是前端團隊成員js能力薄弱,是否需要用bootstrap?
2018年一個合格的前端應該是什麼樣的?
2016 年的今天,Angular 1 還有什麼使用價值?

TAG:JavaScript | 軟體工程 | 前端框架 | React | Angular? |