前端框架的選擇

前端發展日新月異,每年成百數千框架誕生,當我們需要選擇一種來學習時,應該如何挑選?

我認爲應該從兩方面來看:框架優劣的重要性自不必說,影響性能和開發體驗,但另一方面適合自己的需求也很重要,尺有所短寸有所長,在不同情況下的優劣可能相反。

框架的優劣

Paste_Image.png

這是去年主流前端js框架的github新增star數量,很大程度上能體現一個框架的受歡迎程度,受歡迎程度又在一定成都上說明了,框架的優劣,大量程序員都喜歡的一定不會很差。

重點來看前三者,三者中,angular的適用範圍相對窄一些,react可以拓展到服務端、移動端native部分,vue最輕量、還可以用於業務場景非常輕的頁面中(不用全家桶也不錯)。下面從幾個方面來比較一下這三種框架的優劣:

狀態:

在業務界面中我們經常需要數據和界面的交互,根據某些數據去生成界面,通過界面上的操作去改變數據。這其中有兩種,一種就是數據到界面,一種是界面到數據,使用原生或者jquery實現這種操作要大量代碼,而且實時更新也很麻煩,所以主流框架都在交互上進行了封裝處理。
MVVM流派的angular、vue,通過類似模版的語法,通過內部轉換,構建數據和界面狀態的綁定關係,甚至雙向綁定,監聽界面變化,當界面發生改變,按照規則去更新響應的數據,然後,再根據配置好的規則,從數據更新界面狀態。
react則通過函數式編程實現,推崇的是單向數據流:給定原始界面或數據,施加一個變化,就能推導出另一個狀態,有點像狀態機。

組織:

整個業務代碼的模塊關係、業務模型。模塊關係共識就是組件化,整個應用形成組件樹,每個組件樹提供對外接口,用來數據交互,然後內部只關注自己的實現,需要考慮組件的定義、約束、管理、測試等很是複雜;react和vue的組件化成都要優於angular。業務模型指的是所處領域中的業務數據、規則、流程的集合。即使拋開所有的展示層,這一層也是應當要能夠運作起來的。react有redux來輔助管理,angular2引入了RxJS,vue有vuex。如果是學習能力強的人,發現面向函數編程模型的時候會非常喜歡,但是對於大型項目,並非好事。用面向對象、面向過程的那些方式,雖然笨重,但是門檻低,符合大多數人的理解和思維模式,而且經驗豐富。

效率:

分爲開發效率和運行效率。組件化是提升開發效率的一種手段,具體到單個組件的實現上,mvvm系的代碼量會少一些、開發效率稍高一些。其中,angular因爲實現的特殊性,有作用域繼承之類的雙刃劍黑魔法,開發效率的不穩定因素要高不少,深刻理解的人用起來效率很高,不理解的用了到處是坑。angular是三者中運行效率最低的那個,主要在於數據變更方式是髒檢查,當監聽數量提高時,極大影響性能。在針對現實情況的測試中,vue是效率最高的那個(使用和react共同約定的測試基準),在大數據的情況下,react效率最高。

學習曲線:

angular1學習曲線陡峭,大量新的概念、晦澀的說明、複雜的指令;angular2即使不用typescript,它使用es2015的js,18個npm依賴包、4個文件、超過三千多字的介紹來實現一個hello world!;react學習曲線陡峭,需要了解jsx和es2015,需要學習構建系統;vue需要你熟悉html、符合es5的js。

自身的需求:

尤雨溪大神回覆關於框架選擇的問題:
https://www.quora.com/Which-should-I-learn-Mithril-Vue-or-Angular/answer/Evan-You-3
首先要明確自己的需求:
1. 在短期內儘快找到工作
2. 創造更快應用
3. 作爲學習經驗來提高javascript

對於目標一,去學習,最主流、最受企業歡迎的框架,能夠幫助你提高就業競爭力。
對於目標二,如果是一個依靠後端的展示頁面應該選擇更輕、更少插入、不需要特定工具,並且使用html;如果是SPA必須深入瞭解性能、功能、API友好性、工具支持、生態系統成熟度等方面的實際技術對比。這是主觀的、項目依賴的。
對於目標三,應該從輕量級的東西開始學習,大型框架的API很全,封裝的很好,主要是在學習使用框架的API和約定,但是需要自己寫的地方就少了,不利於提高自己的編碼能力。另一方面,方便你理解不同的部分實際上是如何組合的。

尤雨溪大神還建議首先把javascript本身學到精通,這樣風險很小。有了堅實的基礎可以迅速掌握簡單的框架。單獨使用這些框架來寫個小的應用,來了解這些框架解決什麼問題,喜歡哪一種、什麼樣風格的API是你更有效率,從而可以嘗試大型框架。這樣比嘗試一個大型框架幾個月發現不適合自己要好的多。
另一方面他還建議我們瞭解es最新版本的語法,基本的node.js、npm如何工作,框架系統、打包工具這些與框架無關但是可以應用在任何框架中的技術。核心思想是不要把雞蛋放在同一個籃子,選擇js框架不是選擇黨派戰隊,不必永遠堅持一個。無論別人說什麼不要在沒有嘗試的情況下,爲自己做出決定。如果只使用一個框架而忽略其他的,幾乎肯定是錯的。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章