曾幾何時，人人都在寫前端框架，從網(wǎng)上搞點(diǎn)js腳本自己封裝一下就可以搞成一個框架，然而除了用來吹牛外并沒有什么egg用。后來有了Jqury出現(xiàn)了幾乎一統(tǒng)江湖，但是也僅僅是曇花一現(xiàn)，沒持續(xù)多久。最近這些年伴隨著移動互聯(lián)網(wǎng)的發(fā)展，Ajax技術(shù)，V8引擎和Node.js出現(xiàn)和流行催生了JS和前端(全棧)開發(fā)的火熱。前端框架又爆發(fā)了新生，百家爭鳴，但最火的還數(shù)React，Angular和Vue。由于Angular和Vue在語法方面比較相似，究竟如何選擇，本文蟲蟲來就對兩者做下比較論述。

概述

Angular是一個非常受歡迎的企業(yè)級解決方案。銀行，金融機(jī)構(gòu)和后端開發(fā)商通常都支持Angular。Angular由谷歌提供支持，世界上很多知名的公司都在使用它，比如WhatsApp，Instagram，PayPal等公司。

Vue由谷歌前員工尤雨溪(尤小右@weibo)創(chuàng)建。尤雨溪當(dāng)初就在谷歌Angular組工作，所以對Angular知之甚深，Vue吸取了Angular精華，同時提供了快速構(gòu)建易于上手的特點(diǎn)，由于其創(chuàng)作者是國人，所以天然的更符合國人思維的緣故把，Vue在國內(nèi)流行度很高。比如阿里，百度、小米、餓了么，美團(tuán)、B站等都在使用，十幾知名的項目比如GitLab，Grammarly，Chess，fontawesome也都在使用Vue.js。

Angular是開發(fā)企業(yè)應(yīng)用程序客戶端的默認(rèn)商業(yè)解決方案。 Angular是一個更強(qiáng)大，更成熟的框架，通常需要更多時間來開發(fā)應(yīng)用程序。而Vue非常適合簡單，易于上手，高性能，非常適合對性能要求較高的應(yīng)用程序和用于快速原型設(shè)計。

兩者對比

開發(fā)社區(qū)

由于有了谷歌的背書，大樹底下好乘涼，Angular更穩(wěn)定成熟，發(fā)展速度迅猛。 Angular在Twitter上擁有313,000名粉絲，而Vue擁有128,000名粉絲,在微博上尤小右的粉絲也只有不到8w，知乎粉絲為大概9w。為了對Angular和Vue最近的下載情況對比，以NPM過去一年兩者下載數(shù)對比：

GitHub活躍指數(shù)

兩個框架的GitHub活躍數(shù)非常有趣。Vue比Angular有更多的星和Fork數(shù)多。截止當(dāng)前，Vue擁有18743次Fork和131381個星，而Angular只有12144次Fork和46265個星。Vue顯然更受歡迎，當(dāng)然有可能是因為國人使用較多的緣故。Angular在貢獻(xiàn)者數(shù)量方面領(lǐng)先：869比268。由于Angular歷史更久，這也符合預(yù)期。

開發(fā)者調(diào)查

根據(jù)Js 2018年調(diào)查，Vue.js發(fā)展的非常好。Vue的職位不僅提供了與Angular工資想等的平均工資，而且初步使用之后放棄的人要遠(yuǎn)遠(yuǎn)少于Angular。目前，大約有相同數(shù)量的有經(jīng)驗的開發(fā)人員愿意在工作中配合Vue和Angular一起使用，但純用Angular開發(fā)人員已經(jīng)不多，更多的人支持Vue和React。調(diào)查結(jié)果顯示更多的人對學(xué)習(xí)Vue更有興趣。

就業(yè)市場趨勢

與此同時，就業(yè)市場仍然是Angular占優(yōu)勢。 Angular在就業(yè)機(jī)會方面正在減少，已經(jīng)被ReactJs超越，Vue也在快速跟進(jìn)。最近有關(guān)jobfluent的文章清晰的表明了這個趨勢。相比較，Angular工作機(jī)會比Vue工作機(jī)會更多。但是估計很快Vue就會追上來，尤其是國內(nèi)市場(暫無數(shù)據(jù))。

性能對比

接下來，我們對比下運(yùn)行時性能。通常，在大多數(shù)指標(biāo)中，Angular和Vue都是綠色，或者比較差的黃顏色。只在一個指標(biāo)指標(biāo)對Angular有表現(xiàn)不好：非鍵控腳本的啟動時間。Angular的227.6對比Vue的56.9，很清楚地在代碼庫引用Angular會帶來性能問題。在空間和內(nèi)存都受限的應(yīng)用中，很自然會選擇Vue?；谕ㄓ脭?shù)據(jù)，啟動和內(nèi)存分配是Angular的弱點(diǎn)，而它在運(yùn)行時指標(biāo)上優(yōu)于Vue。詳細(xì)結(jié)果和腳本見github倉庫(github:/krausest/js-framework-benchmark)

語法對比

Vue.js的某些功能都是源于Angular。模板，模型綁定，循環(huán)，條件以及事件綁定都有類似工作方式。由于Angular開發(fā)人員比Vue多，所以從Angular轉(zhuǎn)Vue會很容易。所以這兒對兩者相似的地方舉例說明一下：

模板

從技術(shù)上講，可以依賴相同的語法。在對象，數(shù)組和json做評估時候，模板引擎存在細(xì)微差別。相同語法都為：

{{expression}} 

模型綁定

語法和原理都很相似，只有屬性名的差異。

Angular:

VUE：

循環(huán)

Vue語法明顯受Angular的啟發(fā)，兩者差異很小。注意：Vue.js的 v-repeat對ng-repeat語法做了簡化。

Angular:

VUE：

條件語句

除了ng-和v-前綴不同之外，代碼基本一致。

Angular:

VUE：

事件綁定

在Angular中，有不同的事件名稱，比如ng-click，ng-mousedown，ng-mouseover等。而Vue中，有一個事件綁定屬性：v-on。事件名稱在描述綁定的字符串指定。

Angular:

VUE：

在Angular和Vue中還其他的明顯的相似之處。但是所有這些相似也是預(yù)料的事情，畢竟vue.js是很大程度上借鑒了Angular精華的。

語法差異

雖然有那么多的相似，但是兩者語法還是明顯不同的。Angular框架必須使用TypeScript。而Vue并不強(qiáng)制使用TypeScript。Vue.js支持TypeScript的靜態(tài)類型檢查系統(tǒng)，但其用法是非必需的。Vue.js中沒有通用的代碼寫法，支持開發(fā)人員選擇自由的coding風(fēng)格和方式。Vue.js的學(xué)習(xí)曲線遠(yuǎn)沒有Angular的陡峭。選用Vue開發(fā)人員可以一天之內(nèi)就上手寫代碼。所以Vue可以用于快速開發(fā)演示原型，并基于它進(jìn)行迭代，加快開發(fā)進(jìn)度。下面我們來具體說說兩者在語法的上差異，包括模塊(Angular)，組件和指令(Vue)。

Angular模塊可以包含任何功能快，不一定是組件。

而vue.js則組件則是組件化邏輯。

Angular指令通常比vue.js指令更復(fù)雜。 Vue更清晰地分離指令和組件。 Vue.js指令僅封裝了DOM操作，而Angular指令能夠滿足更多的用例。在Angular中，組件只是一個特定的指令。

結(jié)論

Angular和Vue.js都是Web應(yīng)用程序開發(fā)的可行選擇。在編寫代碼時，它們的性質(zhì)也相似。Vue.js更輕量級，而Angular更適合開發(fā)比較復(fù)雜的應(yīng)用程序。但是，Vue的很多企業(yè)級用戶，證明Vue的企業(yè)應(yīng)用程序開發(fā)也表現(xiàn)不俗。

與Vue相比，Angular的主要缺點(diǎn)是其大小、啟動時間和內(nèi)存占用。然而，隨著應(yīng)用程序復(fù)雜性的增加，Angular表行會更穩(wěn)定。