譯者按: 通過使用Angular的經(jīng)歷,作者已經(jīng)完全轉(zhuǎn)為Vue粉了!我們Fundebug目前還是用AngularJS 1,坦白說,學(xué)習(xí)曲線蠻陡的。
公司主營業(yè)務(wù):做網(wǎng)站、網(wǎng)站建設(shè)、移動網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。創(chuàng)新互聯(lián)建站是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團隊。公司秉承以“開放、自由、嚴謹、自律”為核心的企業(yè)文化,感謝他們對我們的高要求,感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn),讓我們激情的團隊有機會用頭腦與智慧不斷的給客戶帶來驚喜。創(chuàng)新互聯(lián)建站推出蔡家坡免費做網(wǎng)站回饋大家。為了保證可讀性,本文采用意譯而非直譯,并且對源代碼進行了大量修改。另外,本文版權(quán)歸原作者所有,翻譯僅用于學(xué)習(xí)。
在Rever, 我們剛剛發(fā)布了使用Vue.js完全重寫的網(wǎng)站。經(jīng)過16周緊張的開發(fā),總共commit了641次?,F(xiàn)在回過頭來,感慨當(dāng)時對框架的選擇是正確的。
在8個月之前,我們還在用Angular 2做網(wǎng)站開發(fā)。更加精確地一點,我們用的是Angular 2 beta 9。坦白的說,這個產(chǎn)品當(dāng)時是由一家外包公司開發(fā),而我們一直對它的方方面面都不滿意。不管是UX/UI,還是架構(gòu)上,甚至Angular 2本身。
在我繼續(xù)抱怨之前,我要承認Angular 2 beta 9和Angular 2.0是完全不同的產(chǎn)品,但這也是Angular的一個問題所在。從beta 9到2.0.0,有8個beta版本, 8個RC(release candidate),以及2.0.0本身。也就是說,如果要更新到2.0.0,需要升級17個版本。我們也嘗試過從beta 9升級到2.0.0,但是因為太多的依賴都破壞了,導(dǎo)致整個更新非常的復(fù)雜。同時,我們開始反問自己選擇Angular 2是否正確,因為Angular開發(fā)團隊已經(jīng)著手Angular 4了。當(dāng)我們好不容易完全更新到2.0.0的那一天,又需要考慮如何更新到Angular 4了。太浪費時間,太浪費精力了!
我們曾經(jīng)不喜歡,現(xiàn)在依然不喜歡的就是Angular 2 默認使用Typescript作為開發(fā)語言。我知道Angular 2可以直接使用JavaScript,但是在Angular 2中使用JavaScript幾乎等于重寫整個項目。我不認為Typescript為開發(fā)增加了附加值,甚至更加糟糕了。我發(fā)現(xiàn)我們的編碼速度反而變慢了。在JavaScript中很簡單的事情,比如定義一個對象,如果使用Typescript就會變得復(fù)雜。在你決定使用Typescript之前,我強烈建議你讀讀下面這兩篇文章。Typescript并不是每個人的最佳選擇。
我依然記得使用Angular 1是多么的簡單。雖然它也有不少問題,但是和其它框架比起來,真的容易。Angular 2卻把Angular的優(yōu)點丟棄了。對于Angular 2, 我的結(jié)論很簡單:Angular 1 和 Angular 2就是雷鋒和雷峰塔的關(guān)系。
所以,你想想我們需要在一個未經(jīng)過測試的系統(tǒng)上更新17個版本,同時還要實現(xiàn)新的功能,現(xiàn)在的代碼本身有著一大堆的bug,代碼質(zhì)量很差,畢竟當(dāng)時的開發(fā)者幾乎都不在團隊里面了,只有我一個同時要應(yīng)對很多問題。我為了正確使用Typescript,需要到處去找正確的文檔。Angular 2已經(jīng)開始升級Angular 4,然而我連Angular 2都還沒升級成功。太多的負面因素快速累積起來。
因此,我們做出了決定:如果升級花費太多的時間,我們就應(yīng)該考慮其它方案了。
React:第一個最明顯的選擇是使用React, 因為每個人都在使用它,如果沒有,那么也在討論它。而且,它有Facebook在后臺撐腰,不擔(dān)心維護問題。但是,React本身不是框架,如果要使用,你需要添加額外的東西。
我們將所有的指標(biāo)列了出來:
接下來,我親自使用React和Vue.js來給出一個評估,而不是通過Google告訴我答案。在此之前,我從來沒有用過React和Vue.js。我們他們重寫了如下部分:
僅僅使用了幾天,我已經(jīng)被Vue.js驚訝到,我已經(jīng)可以完成一個演示Demo給CTO和團隊其他成員。我已經(jīng)很好的理解了Vue.js的基本概念,定義可擴展的架構(gòu)。最重要的是我非常喜歡使用Vue.js的方式寫代碼,我可以感覺到明顯比React快。
使用React比想象中難,要在Redux和MobX中做出選擇并沒有只有一個完美整合的方案好,就像Vue.js搭配的Vuex。如果對于一個框架沒有使用經(jīng)驗的時候,可以讓最開始的決策變得簡單。如果你知道這個框架有官方的庫,將會更有自信。同時,我覺得Vuex的反應(yīng)比Redux快,不夠也許只是個人感覺。
JSX也是一個問題,因為我們不能重用HTML,不夠Vue.js在某種程度上支持我們這么做。 我不喜歡內(nèi)聯(lián)模板(inline template), 而React將JSX/HTML和JS混合到一起。我一直堅信將不同的功能部件分開才是正確的做法,混到一起看上去太丑了。
使用Vue.js的編碼速度遠遠超過React,因為不需要學(xué)習(xí)JSX。而且,一個新的開發(fā)者加入團隊之后,他只需要一個小時的培訓(xùn)就可以上手工作。這一點對我們非常重要。打開一個Vue文件,里面包含了使用HTML和Angular 1相似的標(biāo)簽。一個vue文件還包含樣式和JavaScript部分。你只需要學(xué)習(xí)一點點Vue.js的基礎(chǔ)知識就可以理解它們。
為了快速開發(fā),好的文檔也很重要。Vue.js的文檔簡直太贊!指導(dǎo)、示例、問題和API文檔都非常清晰。在開發(fā)中遇到的問題幾乎都可以通過文檔找到答案。我們開始擔(dān)心很多問題都是中文的,結(jié)果發(fā)現(xiàn)所有的資料都有英文版本。
經(jīng)過一周的考慮,我認為Vue.js非常不錯??墒侵苓叺娜硕紱]有用過,無法給出中肯的建議。我得到的唯一一個意見就是“看上去很酷,不過我從來沒用過”。React最受大家關(guān)注,Angular 2其次。我開始尋找本地是否有使用Vue.js的開發(fā)者,結(jié)果真的找到了,讓我覺得不在孤單。而且我的技術(shù)圈子本來就很小,所以沒有注意到誰在生產(chǎn)環(huán)境使用Vue.js。
在我們考慮選擇Vue.js還是React的時候,同時有考慮到要重寫我們的移動端。React Native看上去是一個不錯的選擇。如果我們真的決定用React Native做移動端,可以復(fù)用桌面端和移動端的代碼,對決定選擇React有很大的加分。不過,我最終決定不考慮這個情況也許不會發(fā)生的情況。從我的經(jīng)驗來看,使用Node.js已經(jīng)讓我可以在前端和后端重用非常多的代碼。
在我寫這篇博客的時候,網(wǎng)上有很多關(guān)于Facebook將React的版權(quán)許可改為BSD+Patent的討論。根據(jù)Facebook的解釋,這個版權(quán)許可防止他們被專利流氓(patent troll)。雖然這不是影響我們決定的一個主要因素,但是如果你使用React,而React有相關(guān)版權(quán)問題,你也不想聽到。
換個角度,F(xiàn)acebook可以說是React的一個負擔(dān),而不是助力。這也是為什么一個獨立的基金或組織來維護開源軟件項目更好。IBM做了一個很好的示范,當(dāng)他把Strongloop買下來以后,把Express.js捐給了Node.js基金會。來自社區(qū)的壓力和IBM的期待,使得軟件一直很好的維護下去。Twitter也是一個很好的例子,他們使用MIT協(xié)議發(fā)行Bootstrap,這樣再也沒有人會討論Bootstrap的版權(quán)問題。
在我做出最終決定之前,我在網(wǎng)上調(diào)研了很久。有一張開發(fā)者對現(xiàn)有JavaScript狀態(tài)的調(diào)查吸引了我的注意力。我承認,作者并沒有用非常嚴謹?shù)目茖W(xué)的方法去調(diào)研,但是卻給我們提供了很多非常有用的信息。如果你想閱讀原文,請點擊The State Of JavaScript: Front-End Frameworks。
衡量指標(biāo) | Angular 2 | React | Vue.js |
---|---|---|---|
穩(wěn)定 | 是 | 是 | 是 |
有強大的社區(qū) | 是 | 是 | 還不夠大 |
后盾 | Laravel和阿里巴巴 | ||
文檔清晰 | 是 | 是 | 是 |
容易上手 | 一般,Typescript難學(xué) | 還可以 | 是 |
可以集成Bootstrap | 是 | 是 | 是 |
大小 | 566K | 139K | 58.8K |
易復(fù)用 | 是 | 只有CSS | 是,HTML和CSS |
編碼速度 | 慢 | 一般 | 快 |
反應(yīng)速度(Reactivity) | 還可以 | 快 | 快 |
基于組件 | 是 | 是 | 是 |
總的來說,在我們的評估中,Vue.js勝出。在StackOverflow有很多問答,官方文檔十分清晰,代碼體積小,和Bootstrap完美集成,由Laravel和阿里巴巴支撐。雖然社區(qū)還不夠大,但是已經(jīng)足夠大了。
選擇Vue.js是一個正確的選擇,雖然我花了不少時間來說服CTO。我很感激他總是提出一些有用的難問題,使我可以保證我的決定是100%正確。如果我的決定真的做錯了,將會非常后悔的。我想直到他親手寫了一個組件發(fā)現(xiàn)相當(dāng)?shù)娜菀撞耪娴耐耆_信Vue.js的能力的。
我沒有說React不好,它擁有那么大的一個社區(qū),我感到非常震撼。它有它的好處,jQuery的社區(qū)更大,但沒有使它成為一個我們想要使用的好的框架/庫。我們想要簡單,而Vue.js擁有這一點。如果你還是不確定,可以讀一讀下面這篇文章:Comparison with Other Frameworks。
Fundebug專注于JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java實時BUG監(jiān)控。 自從2016年雙十一正式上線,F(xiàn)undebug累計處理了9億+錯誤事件,得到了Google、360、金山軟件、百姓網(wǎng)等眾多知名用戶的認可。歡迎免費試用!
轉(zhuǎn)載時請注明作者Fundebug以及本文地址:
https://blog.fundebug.com/2017/09/20/why-we-moved-from-angular2-to-vue/
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場景需求。