Vue.js 為何能逆襲 Angular 和 React 而主導前端？

作者 | Maja Nowak

譯者 | 蘇本如

責編 | 屠敏

出品 | CSDN（ID：CSDNNews）

隨著在Github上的支持數超過12萬，Vue.js以相當大的優勢擊敗了Angular和React成為當前最熱門的JavaScript前端框架。雖然在總的市場佔有率上React依然稱王，而Angular以其獨有的特性，地位難以撼動。但從我們自己的團隊而言，我們成為Vue的忠實粉絲已經有一段時間了，全球的開發者群體也在效仿。那麼，是什麼原因使得Vue的支持數月月攀升呢？

Vue最初可能是其創始人Evan You的一個新項目的開發需要，經過多年的發展，它已經成為一個成熟的框架，擁有成熟的生態系統和開發工具包。在它的發展過程中，Vue吸引了大量的代碼貢獻者、贊助者和傳播者。

Source: Tim Qian（https://www.timqian.com/star-history/#vuejs/vue&angular/angular&facebook/react）

然而，從JS前端框架的市場佔有率和商業應用上， React仍是大贏家。但是毫無疑問，Vue不會消失，它正在持續地一步步地被大家認可並付諸實踐。

事實上，StateofJS的調查結果顯示，使用過Vue並將再次使用Vue的開發人員數量從2017年的19.6%上升到2018年的28.8%。在同一份調查的「用戶滿意度最高的前端框架」這一項上，Vue獲得了91.2%的最高分。

我認為Vue在今年的StateofJS的前端框架滿意度調查中獲得了91.2%的最高分，這要歸功於我們的用戶，我們的目標是做得更好！希望我們能改變568個不想再使用它的人的想法；https://t.co/7rm8y4ekq— Evan You (@youyuxi) 2018年12月19日

讓我們來看看下面的統計結果：

表中的百分比是指「聽說過並願意學習它」的比例. 統計數字來源: stateofjs.com

為什麼Vue.js會持續增長？

Vue是建立於 Angular和React的基礎之上，它保留了Angular和React的優點並添加了自己的獨特成分，這保證了Vue足夠的美好來吸引JS開發人員的胃口。

下面來談談Vue的過人之處：

平緩的學習曲線

Vue平緩的學習曲線贏得了初學者和高級開發人員的歡心。我們在State of Vue.js報告中調查過的開發人員都說，學習曲線是Vue引起眾多開發人員興趣的主要原因。在瀏覽完官方指南中包含的材料後，您就可以著手開發您的第一個Vue應用，而無需事先了解ES2015、typescript、JSX或其它前端框架。

你只需要對Javascript、HTML和CSS有一個基本的理解就可以開始使用Vue來構建您的應用。當然如果您在使用框架方面有一些經驗會更好，特別是您正在構建的是複雜的Web應用（稍後將詳細介紹）。

Vue的高可訪問性有助於快節奏的開發團隊在不需要花費大量時間熟悉多餘的語法擴展的情況下快速出成果。為一個項目組建一個團隊或將Vue集成到一個項目中變得更容易、更快。儘管目前市場上的Vue開發人員還不多，但只要有使用React的經驗，開發人員就可以輕鬆地切換到Vue，且只需一周左右的時間就可以出成果。

Vue還減少了理解複雜代碼所需的時間（這在使用Angular時很常見）。這一點對編寫簡單的Web應用特別方便。

模塊化、靈活的開發環境

Vue的Web應用是使用組件構建的。因為Vue已經根據項目需要為開發人員提供了許多靈活性和適應性，而且Vue的單文件組件是鬆散耦合的，這可以提高代碼重用性，進而縮短了開發時間。

基於組件的架構是構建將來有擴展需求的應用的理想選擇。Vue要求構建大型應用時一開始就使用模塊化來構建系統。但是Vue在這裡也給了開發人員一些靈活性，因為Vue、Webpack或Browserify推薦的bundler具有稍後用您選擇的預處理器轉換源代碼的能力。

開發的樂趣

在Monterrail團隊，我們的開發人員經常強調他們使用Vue構建應用程序的純粹樂趣。自由地按照開發人員喜歡的方式構造代碼，以及無傾向的編碼方式，是Vue深受開發人員熱捧的主要原因。

梳理代碼庫變得輕而易舉，實際上您所需要的一切都在.vue文件中。從數據模型和模板到CSS、屬性、計算值和方法，所有組件如何工作都可以從中找到，這讓您省去額外的麻煩。

豐富的生態系統和開發工具的多樣性

Vue以豐富的代碼庫和成套方便開發的工具，滿足了開發人員的所有需求。這些有名的旨在提高編碼體驗的工具包括：用於狀態管理的Vuex和用於路由管理的Vue-routing, 後者可以將單頁應用程序的和對應的URL一一映射，讓構建單頁面應用變得易如反掌。

Vue還有自己的官方調試工具 devtools ，它作為瀏覽器擴展的形式出現。devtools簡化了應用程序調試和組件的狀態和層次結構的檢查。它允許實時編輯應用程序、跟蹤自定義事件和跨時間點調試應用程序，以查看以前的版本和所做的更改。

支持移動開發

Vue為開發人員提供了一些跨平台移動用戶界面開發的解決方案。包括阿里巴巴（Alibaba）創建的Weex，和以擁有海量工具、組件和插件庫著稱的NativeScript。最近，Ionic也加入進來了。

與React Native的「Learn once, write anything」不同，Weex和Nativescript都宣稱「Write once, run it anywhere」。這種設計使您能夠在多個平台之間以透明和可重複的方式管理UI。這點很太棒。

特有的響應機制

各種HTML元素中的數據在現代的Web應用中動態地渲染。Vue的特有的響應機制可以自動刷新用戶界面。這種方法節省了大量的時間和額外的代碼行，以便開發人員可以集中精力來開發其他功能，從而提高效率。

高性能

Vue.js速度很快。儘管它不是最快的框架，但Vue.js目前所具有的特性足以為SPA和UI提供完美的用戶體驗。

對於移動應用，Vue相比Angular和React而言，它能更快地啟動應用。鑒於53%的用戶會放棄載入時間超過3秒的網站，而移動應用又是現在網站提升用戶體驗的第一選擇，因此Vue的高性能就變成了選擇JavaScript前端框架的一個重要考量。

支持HTML模板

這點有些爭議，但引入基於HTML的模板提高了工作效率，特別是對於我們這些有HTML基礎的人來說有很大的吸引力。Vue的模板也有助於將它的快速響應機制引入到已有的Web應用。模板由Vue編譯以具有虛擬DOM渲染功能。這樣做的好處是，在App狀態改變時，Vue向DOM中引入的操作最少。

社區交流活躍

Vue社區的蓬勃發展積極地促進了框架的發展。全世界每年都有幾次專門為Vue舉辦的大型會議。

下面是一些即將召開的值得關注的會議：

• Vuejs Amsterdam 2019：https://www.vuejs.amsterdam/
• Vue Fes Japan：https://vuefes.jp/
• VueConf US：http://us.vuejs.org/

Vue社區不僅僅組織正式的會議，Vue非正式的交流在六大洲的很多國家一直在進行，通過一杯啤酒或咖啡，Vue開發人員就可以分享他們使用框架的知識和經驗。

容易上手

Vue.js有非常好的官方文檔，讓開發人員可以很容易地找到所需的關於Vue的方方面面。官方指南有示例和詳細描述。API文檔還收錄了開發人員在編碼時可能遇到的大多數問題和解決方案。

教程

除了通過官方指南學習Vue，您還可以通過一些可獲得的教程（包括視頻和示例）來掌握Vue中的編程技巧。一些免費教程會以有趣的方式引導您全面掌握Vue（例如Scrimba –它是 Vue的推薦教程）。

以下列出其它可能讓你迷上Vue的教程：

• Intro to Vue.js by Vue Mastery：https://www.vuemastery.com/courses/intro-to-vue-js/vue-instance/
• Vue on Laracasts：https://laracasts.com/series/learn-vue-2-step-by-step
• Vue.js on Tutorialspoint：https://www.tutorialspoint.com/vuejs/

StackOverflow和官方聊天頻道

對於教程中沒有涵蓋的各種代碼疑難問題，您可以用Ask a question on StackOverflow得到你所要的答案。新的問題和回復會一直彈出，所以不管你的問題有多複雜，你都很有可能得到你要的答案。

當你遇到一個緊迫的編程問題時，你不會孤軍作戰，你可以在Vue官方聊天頻道中向其他編碼人員尋求幫助，很快你就會收到回復。

Vue持續發展

Vue自2014年發布，一開始許多開發人員都不願採用它，因為每個人都擔心它會被放棄而導致需要承擔合併代碼到另一個框架中的艱巨而昂貴的任務。當然這一切都沒有發生。Evan You在2018年9月宣布將要發布Vue.JS 3.0版，儘管到目前為止還沒有明確的發布日期，但是這次更新的重要性在於它是基於開發人員的貢獻和並解決了大家反饋的問題。在沒有知名品牌企業支持的情況下，Vue能快速發展到現在是一項了不起的壯舉。

Vue的生態系統正在越來越大，越來越好，也越來越受到開發人員和企業的讚賞。

誰在使用Vue？

Vue.js可能還不是最流行的Javascript前端框架，但它已經被阿里巴巴、Grammarly、小米、Laracasts和Reuters等大牌公司所接受。要想更好地了解Vue的過人之處，你可以瀏覽大量的UI組件、網站、模板、插件、應用等等，或者通過使用Vue來構建您的應用。

至於後端框架對Vue的支持，PHP框架Laravel就建議使用vue.js進行前端開發，儘管這不是必須的。

我應該將Vue.js添加到我的技術堆棧中嗎？

答案是Yes。然而，Vue並不是唯一值得關注和有前景的JS前端框架。你最好先測試一下並使用一些框架後，再看看哪些框架適合你的項目需求。

所以即使我們喜歡Vue，它也不是一個完美的框架。但我們必須承認，Vue已經儘可能地接近完美。而且如果我們根據它的學習曲線、維護的連續性和提高開發人員生產力的能力來評判的話，那麼Vue就是那顆最耀眼的星星。

原文： https://www.monterail.com/blog/reasons-why-vuejs-is-popular本文為 CSDN 翻譯，如需轉載，請註明來源出處。

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！