關於對前端三大框架的看法你瞭解多少?

語言: CN / TW / HK

寫本文的原因

最近公司的一個實習生來問我,三大框架有什麼區別我竟一時語塞,隨後便敷衍了幾句。 雖然都有用過但是並沒有仔細分析三大框架的不同點以及它們的設計思路。 最近忙很久沒有寫文章了, 剛好又在學習Vue原始碼, 那麼我從Vue出發來分析一下這三個框架到底有什麼區別吧。 相信大家一定聽過以下的一些話: - Angular學習成本真TMD高! - Vue上手起來真簡單!做起東西來真是快! - React怎麼那麼難啊! - React用起來比vue angluar靈活太多了! - 等等...

文章沒有任何程式碼簡單的從各個框架的特點以及開發模式進行分析, 相信看完就能理解上面那些吐槽了。

從Vue官網簡介開始

首先我們看看官網對於Vue的定義

image.png

這裡重點兩個詞: 漸進式框架自底向上。是不是不好理解? 如果不瞭解各個框架的特點是不好理解這幾個詞代表的含義, 通過分析各個框架分析我們能更深入的理解它們的含義。

Angular

我們先看一下官網的api列表, 是不是感覺有賊多的東西在裡面?

image.png

特點: 區別於vue和react, Angular是綜合框架開發平臺, 更加關注的是專案應用, 而不是光解決一個檢視渲染, 幾乎把所有的需求都放入框架內部(包括動畫) 使用者需要什麼可以直接用它定義好的方法進行使用(什麼我都準備好了你直接用就行)。

開發模式: 由於框架一開始就集成了大多數業務需求, 所以開發模式是自上而下的, 直接拿裡面的api進行使用。

編寫規範: 有強規範必須按照提供的方法來寫, 並且有依賴注入嚴格體系在裡面。同時又有新的業務場景功能加入, 所以經常要用最新的JS和TS超集來開發(這也是學習成本高的點之一)。

總結: 由於Angular內部一開始就大集成了很多功能, 所以有很多大型專案都使用這個框架, 並且框架每次更新迭代都會加入一些功能和特點, 導致學習成本也會越來越高, 這也是我們常說的Angle學習起來很麻煩。

React

我們看以下官網對React介紹

image.png

發現有什麼特點嗎? 沒錯官網對於React的定義是一個庫,而非一個框架!

特點: React功能只有一個點, 那就是把資料渲染到頁面。 所以它不稱自己為框架, 因為它不提供中央管理(redux)以及路由(react-router)等框架常用的功能模組。 類似於redux react-router這些都是第三方進行支援的。

image.png 大家可以看react官網中是沒有 redux 以及react-router的相關內容。

開發模式: 由於react只提供了檢視處理方案,其他的需求例如中央狀態管理、路由什麼的都需要自己去看第三方外掛進行配置(這也是有人覺得react比較難的點之一)。

編寫規範:由於React編寫沒有強規範, 其實每一個元件的本質就是一個類或者函式,自己想怎麼寫就怎麼寫(所以人們都說react靈活性強)。 唯一特殊點就是在編寫dom的時候要使用react的語法。

Vue

特點: 一個核心就是使用者介面View層, 主要關心怎麼把資料渲染到檢視中。但同時也可以選擇性整合其他功能,例如中央狀態管理vuex,路由vue-router。

開發模式: 從它可以進行選擇性整合微型庫(Micro libs)例如vuex vue-router的特點,在結合官網的說明這裡就能理解了什麼是漸近式框架和自下而上這些詞了。Vue基礎只給你一個檢視庫,如果你需要更多功能也行你自己選擇需要的功能進行整合進來。 你可以從最簡單的開始,當熟悉了Vue的開發模式後需要哪個功能再去學習也不遲。

vue對比React和Angular: Vue是最後一個出來的框架, 尤大借鑑了angular以及react兩者的特點並且加入了自己的想法, 區別於Angular框架vue不需要的功能可以不整合進來, 又不同於React只單單提供一個檢視庫,需要其他功能還需要第三方進行支援。 vue可以進行選擇性整合。它的中心思想是: 先處理好檢視,如果需要路由等其他功能可以之後進行整合,漸進的處理後續的工作。 這就是為什麼稱Vue是漸進式框架的原因。

總結

也不知為啥, 現在國內一些論壇上都覺得用Vue做的專案很辣雞,技術水平不高。 突然也想起剛入行時候經理讓我學Vue, 大概學習了一個星期就開始上手專案。 其實現在很多公司使用Vue來做專案也很符合他們的情況, 因為國內做專案大部分時間都是很緊的,必須有一個上手簡單學習成本低並且有規範的框架供大家一起使用。 也並不是說其他框架不好, 像大型應用使用angular也挺好, 如果JS功底紮實的話用React來做專案會感覺沒有框架的束縛寫起來更加的得心應手。 所有每個框架有每個框架的特點和對應的場景, 不考慮現實情況下的胡亂鄙視都是耍流氓~

以上就是本文對三大框架做的一些總結, 希望能幫助到大家~