前端框架這麼多,該如何選擇?

2021-08-05 20:43:53 字數 1571 閱讀 7078

有過前端開發經驗的同僚們可能會想到:要有可復用的元件,要控制質量做測試和靜態檢查,要有元件隔離的樣式方便實現responsive,要打包部署方便,最好學起來不要太複雜,方便能力建設、節省招聘成本等等。

接下來,我們將從元件復用、測試和學習曲線這三個主要的方面對angular4,ember.js,vue.js和react這四個當前最流行的框架來做更深入的分析,提供更具體的參考。

1. 可復用的元件

元件復用是每個專案都會重點關注的乙個維度。合適的、職責單一的元件會大大提公升新特性的開發效率和工程的可維護性,也能方便地進行測試。那麼他們的表現都如何呢:

概括起來,就是vue、component的元件相對靈活、輕量,新增依賴就可以無縫整合到遺留系統中。對於從0到1的系統,也可以使用新的實踐來構建工程,例如es6、webpack等技術。angular4官方推薦使用typescript,這需要單獨構建和打包,不方便與遺留系統整合。ember.js自定義了一整套生態,基於coc理念的設計,採用了前端工程中比較前沿的實踐和標準,很難與遺留系統整合,更適合在新專案中使用。至於資料繫結,各有優勢。雙向繫結在表單互動多的場景中更便捷,單向繫結在管理跟蹤記錄元件狀態時更高效。元件狀態更新,各有不同的實現:

其中,主要的區別是angular4是通過事件監聽,對比資料更新,直接操作dom來更新檢視,而其它都通過virtual dom的思路來更新檢視。

2. 元件測試

測試是提高軟體質量的有效手段,易於編寫測試的框架,能降低編寫測試的成本,充足的測試也能提高我們交付軟體的信心。它們在元件測試方面的比較如下:

可見,vue, react測試靈活,可以根據專案具體情況來定製,但是沒有統一的測試實踐規範,對開發人員的能力有較大依賴。angular4和ember概念多,有官方推薦的實踐,要完全掌握難度大,優勢是實現起來更規範。

3. 學習曲線

在技術選型過程中,保證專案按時交付,控制風險,團隊能力建設提公升,都是需要考慮的因素。作為乙個軟體服務公司,如何快速的提公升人員能力,選用學習曲線合適的框架,控制專案成本也是一門技術活。下面,對使用這些框架的難度進行了一些簡要分析:

通過上面三個維度的分析,我們發現vue.js和react的重點更側重於建立可復用、易於測試、能靈活整合的元件。當然,通過其它擴充套件元件,以及一些腳手架外掛程式的支援,也可以方便的搭建乙個採用最新實踐的前端應用的構建框架。它們最大的優點是按需定製,學習曲線平滑,構建出來的應用小而精。

相對來說,angular4和ember是大而全的框架,它們更側重於大型前端工程的構建,為開發人員遮蔽專案構建底層的細節,提出了自己的一套解決方案。使用它們的難點是要度過前期曲線陡峭的學習期,優點是由於使用了標準化的開發方式,後期能極大的提高開發生產力,提公升開發效率。

最後,說了這麼多,大家在具體選型時還是要首先分析自己的需求和現狀,然後再做選擇。不求最酷炫,只求最合適!

Vue該如何選擇前端UI框架

vue 是一套用於構建使用者介面的漸進式框架。與其它大型框架不同的是,vue 被設計為可以自底向上逐層應用。vue 的核心庫只關注檢視層,不僅易於上手,還便於與第三方庫或既有專案整合。另一方面,當與現代化的工具鏈以及各種支援類庫結合使用時,vue 也完全能夠為複雜的單頁應用提供驅動。1 如果你是在做...

選擇器竟然有這麼多!!!w w

慚愧 做了這麼長時間的前端 其實也就半年多吧哈哈 平時用到的選擇器都是id 類 標籤,最多用到屬性和子選擇器,到今天才知道平時用到的這些都是css選擇器,竟然還有jq選擇器,css選擇器和jq選擇器之間竟然還有這麼多區別,彷彿發現了寶藏,啊哈哈 廢話不多說,經過一番查閱資料,自己總結如下,如有錯誤,...

框架選擇 如何看待前端框架選型

對於前端團隊,可以實現企業受益最大化要點。一 技術選型的策略 1 保證產品質量 1 功能穩健 網頁不白屏,不錯位,不卡死 操作正常 資料精準。2 體驗優秀 載入體驗,互動體驗,視覺體驗,無障礙訪問。2 降低人力成本 1 降低前期開發成本 2 降低後期維護成本。二 前端開發模式選擇 開發模式 1 純前...