主流前端技術對比

1、jQuery

a)最流行的WEB前端JS庫,但隨着瀏覽器廠商對HTML5規範統一遵循以及ECMA6在瀏覽器端的實現,jQuery的使用率可能會變得越來越低,逐漸被其他JS庫取代;

b)依靠豐富的dom操作去組合業務邏輯,當業務邏輯複雜的時候,代碼可讀性較差,業務邏輯和UI交互混在一起;

c)UI裏參雜着交互邏輯,邏輯比較混亂,但UI交互邏輯能夠更加靈活地嵌入到業務邏輯;

d)jQuery是使用選擇器($)選取DOM對象,對其進行賦值、取值、事件綁定等操作,其實和原生的HTML的區別只在於可以更方便的選取和操作DOM對象,而數據和界面是在一起的。

2、Vue.js

a)新興起的WEB前端JS庫,是一個精簡的MVVM,用於構建用戶界面的漸進式框架,採用自底向上增量開發的設計;

b)Vue.js專注於MVVM模型的ViewModel層,易學習,易與其它庫或已有項目整合;

c)通過雙向數據綁定把View層和Model層連接了起來,通過對數據的操作就可以完成對頁面視圖的渲染,可以直接在vue文件中使用html標籤,數據綁定時類似angular,可以進行條件渲染;

d)通過Vue對象將數據和View完全分離開來了,對數據進行操作不再需要引用相應的DOM對象,可以說數據和View是分離的,他們通過Vue對象這個vm實現相互的綁定;

e)Vue.js的數據和方法都掛載在Vue上,數據掛載在Vue的data,方法掛載在Vue的methods,相比其他前端技術框架,代碼風格更加優雅;

f)具有模塊化、組件化和路由等特點,可以自由搭配使用需要的庫插件,相比其他MVVM框架具有小巧、簡單、快速、緊湊等優勢。

3、Angular.js

a)MVVM(Model)(View)(View-Model);

b)模塊化(Module)控制器(Contoller)依賴注入;

c)雙向數據綁定,界面的操作能實時反映到數據,數據的變更能實時展現到界面,渲染速度快;

d)Angular.js所有的數據和方法都是掛載在$scope上,其中雙向數據綁定的實現使用了$scope變量的髒值檢測,使用$scope.$watch(視圖到模型)或$scope.$apply(模型到視圖)檢測,內部調用的都是digest,當然也可以直接調用$scope.$digest進行髒檢查。當數據變化十分頻繁時,髒檢測對瀏覽器性能的消耗將會很大,官方註明的最大檢測髒值爲2000個數據;

e)框架比較複雜,比較笨重(相比Vue.js)。

4、Recat.js

a)React.js以組件的方式重新思考UI構成,將UI上每一個功能相對獨立的模塊定義成組件,然後將小的組件通過組合或者嵌套的方式構成大的組件,最終完成整體UI的構建;

b)代碼量較大,既要管理UI邏輯,又要操心dom的渲染;

c)React.js採用了jsx語法,運用虛擬DOM的概念進行DOM對頁面元素進行渲染,獲取頁面元素需要用ref來獲取,似乎更加安全;

d)框架比較複雜,比較笨重(相比Vue.js)。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章