比較React與Angular 2.0，探討二者各自的優勢與短板。

[[166041]]

ReactJS快速回顧

ReactJS是一套JavaScript Web庫，由Facebook打造而成且主要用于構建高性能及響應式用戶界面。React負責解決其它JavaScript框架所面對的一大常見難題，即對大規模數據集的處理。能夠使用虛擬DOM并在發生變更時利用補丁安裝機制只對DOM中的dirty部分進行重新渲染，React得以實現遠超其它框架的速度表現。

Angular 2滿載強化機制

Angular 2相較于Angular 1迎來一系列強化。首先，Angular 2高度關注創建可復用的前端組件。盡管Angular 1在一定程度上也能實現同樣的效果，但該框架的新版本解決了大量影響利用性的難題，例如對$scope與控制器的依賴性。其指令亦得到顯著簡化，使得Angular 2代碼較前代更易于輸入及閱讀。Angular 2還考慮到與TypeScript的協作需求，消除了大量用于保證類型安全的代碼。再加上眾多性能與框架改進，Angular 2確實給人煥然一新之感。

注意事項

值得強調的是，React與Angular（任意版本）之間的比較其實并不對等。Angular是一套前端框架，負責為應用客戶端提供完整架構，并允許我們將客戶端代碼作為強大的功能套件。而React則是一套庫，其提供的功能并不豐富——其主要作用是充當完整項目的組成部分，而非主導整體代碼結構。當然，二者之間也存在著相當程度的相似性，而這也正是此次比較存在的理由所在。

架構

如上所述，React是一套用于創建響應式模板的JavaScript庫。因此，React并不真正關注架構——它更像是一款作用于應用內大型客戶端代碼中的工具。

另一方面，Angular 2則以框架的角色指明了前端代碼的“正確設計方式”。其專注于組件與類型安全，允許大家將注意力集中在代碼本身，并在強調復用性與封裝的同時建立面向對象前端。

從這個角度來看，React與Angular 2實在沒什么可比性——React適合那些希望以更為靈活的方式構建代碼架構的朋友，而Angular 2則屬于應用前端的整體架構選項。因此，誰能更好地適應應用設計模式的需求，誰就將在這一環節中勝出。

模板

兩套方案皆提供模板工具，但采用的模板管理方式則區別很大。React以JSX為基礎構建模板對象，大家可以構建內聯模板并將所有模板代碼進行集中保存。Angular 2則以物理方式將用于驅動應用的JavaScript與作為渲染對象的HTML加以分離。

不過由于更關注組件化且能夠與TypeScript順暢協作，因此大家往往能夠憑借Angular 1.x實現更出色的復用性與靈活性。總而言之，在選定了理想的模式之后，具體選擇將由美學與基本功能決定——React模板更緊湊且渲染速度更快，而Angular 2組件則更具復用性，并通過無處不在的雙向數據綁定簡化應用對象管理流程。

原生支持

Angular 2與React有著不同的底層目標，這也意味著二者在支持原生設備代碼時有著截然不同的表現。Angular 2團隊決定專注于框架本身，并將設備可運行代碼方面的工作交給其它供應商。而React生態系統則推出了React Native——這套框架能夠將React代碼翻譯為原生應用體驗，從而帶來遠超傳統混合型Web應用的性能表現。

再次強調，選擇“正確的”方案才是理想的思維方式。如果大家希望自己的移動應用體驗快如閃電，那么React將直接勝出。但如果大家希望采用組件化程度更高的應用架構，同時愿意犧牲部分性能以提升代碼結構一致性，那么Angular 2與Ionic等框架的結合則將成為正確答案。

總結

Angular 2與React的選擇其實只是一種風格偏好。React專注于渲染速度且能夠在客戶端或原生應用內處理復雜的UI設計，而Angular 2則更具開發普適性。它既能夠引導我們逐步構建自己的應用，同時也提供一定的表現力及可復用UI設計機制。

最終決定取決于應用設計目標及開發團隊的普遍意見。大型復雜用戶界面外加出色性能是React的王牌，開發流程與代碼架構則是Angular 2的主場。總之，只要能夠充分考量實際需求與定位，大家一定能做出正確的選擇。

原文標題：Angular 2 vs. React

【51CTO譯稿，合作站點轉載請注明原文譯者和出處為51CTO.com】