前言
自上次發布了《移動APP開發框架盤點》后，時間已經過去了三年， 為什么突然又寫一篇續集呢？是因為有一個非常有意思的發現，
開源專案其實有一個成熟周期，這個周期大概是三年左右，自React框架在2013年發布并引爆了前端框架的大潮，這個屬于前端的周期就此開始了，
之后在2015年5月開源的React Native又開啟了屬于Web移動前端的周期，15-16年，18-19年，21-22年正好就是屬于移動前端的三個爆發點，
三年前，在第一個成熟識訓期，我盤點了移動開發框架，在這第二個成熟識訓期，理所當然要來盤點一波，
不過，當我點開github專案的code-frequency時，還是被這個準到嚇人的周期猜想驚呆了，先給你們看一波，剩下的自行驗證，
1、https://github.com/youzan/vant/graphs/code-frequency
2、https://github.com/quasarframework/quasar/graphs/code-frequency
Web移動前端框架串列
| 序號 | 專案 | 支持框架 | 分類 | 推薦度 | 出品方 | github |
| 1 | Framework7 | Vue、React、Svelte | 網頁 | nolimits4web | /framework7io/framework7 | |
| 2 | Ionic | Angular、React、Vue | 網頁 | Ionic | /ionic-team/ionic-framework | |
| 3 | Onsen UI | Angular、React、Vue | 網頁 | /OnsenUI/OnsenUI | ||
| 4 | Konsta UI | Vue、React、Svelte | 網頁 | nolimits4web | /konstaui/konsta | |
| 5 | NutUI | Vue、React | 網頁 | 京東零售 | /jdf2e/nutui | |
| 6 | Antd Mobile | React | 網頁 | 螞蟻金服 | /ant-design/ant-design-mobile | |
| 7 | Zarm | React | 網頁 | 眾安科技 | /ZhongAnTech/zarm | |
| 8 | Vant | Vue | 網頁 | 有贊前端團隊 | /youzan/vant | |
| 9 | Quasar | Vue | 網頁 | /quasarframework/quasar | ||
| 10 | WeUI | React | 網頁 | 停維 | 騰訊 | /weui/react-weui |
| 11 | VUX | Vue2 | 網頁 | 停維 | /airyland/vux | |
| 12 | Mint UI | Vue2 | 網頁 | 停維 | 餓了么前端團隊 | /ElemeFE/mint-ui |
| 13 | Cube UI | Vue2 | 網頁 | 停維 | 滴滴出行 | /didi/cube-ui |
| 14 | Mand Mobile | Vue2 | 網頁 | 停維 | 滴滴出行 | /didi/mand-mobile |
| 15 | Vonic | Vue2 | 網頁 | 停維 | /wangdahoo/vonic | |
| 16 | Wot Design | Vue2 | 網頁 | 停維 | 京東平臺生態前端 | /jd-ftf/wot-design |
| 17 | Taro | React、Vue | 漸進 | 京東凹凸實驗室 | /NervJS/taro | |
| 18 | kbone | Vue、React | 漸進 | 騰訊 | /Tencent/kbone | |
| 19 | Remax | React | 漸進 | /remaxjs/remax | ||
| 20 | uni-app | Vue | 漸進 | Dcloud | /dcloudio/uni-app | |
| 21 | Mpx | 類Vue | 漸進 | 滴滴出行 | /didi/mpx | |
| 22 | mpvue | Vue2 | 漸進 | 停維 | 美團 | /Meituan-Dianping/mpvue |
| 23 | Megalo | Vue2 | 漸進 | 停維 | 網易考拉前端 | /kaola-fed/megalo |
| 24 | WePY | 類Vue | 漸進 | 停維 | 騰訊 | /Tencent/wepy |
| 25 | Chameleon | 類Vue | 漸進 | 停維 | 滴滴出行 | /didi/chameleon |
| 26 | Hippy | React、Vue | 橋接 | 騰訊QQ瀏覽器 | /Tencent/Hippy | |
| 27 | Hummer | Vue、React | 橋接 | 滴滴出行 | /didi/Hummer | |
| 28 | Kraken | Vue、React | 橋接 | 淘寶 | /openkraken/kraken | |
| 29 | ReactNative | React | 橋接 | /facebook/react-native | ||
| 30 | Weex | Vue2 | 橋接 | 停維 | 淘寶 | /alibaba/weex |
專案盤點
再來說第二個比較有意思的發現，停止維護的專案絕大多數是Vue框架專案，
盤點開始的時候我還覺得React框架處于絕對劣勢，到完成時我發現React無論在選擇面還是成熟度上都超過了Vue，
原因我這里就不分析了，反正大家都有自己的看法，
網頁類框架
網頁類框架就是前端組件框架，這一次雖然有大量專案停止維護，但是也有很多專案堅持了下來，而且還涌現出了一批新專案，
大廠占了主導，因為這些年大廠在移動開發上的需求，遠高于其它方面，個人專案要堅持確實不易，
本來是想要做一個驗證專案，把所有框架都試用一遍并給出推薦度的，由于進度太慢，還是下一次再發吧，
漸進類框架
這次的重點是漸進類框架，就是所謂多端同構框架（小程式框架），這幾年國內的重點的各種小程式平臺，所以多端框架的需求很是旺盛，
不過大多數先行者都沒挺過來還是讓我很意外，只有Taro成功了，想想還是有很多讓人唏噓的東西，
在這里還是先預測一波吧，因為這一類框架最變化最大，最侄訓是有很多框架要出局的，
漸進類框架是一個過渡性的產品，最侄訓變成橋接類框架的一部分，所以，與橋接類框架協同才是框架的出路，
橋接類框架
這個賽道基本全是大廠了，
Hippy
騰訊新一代跨端開發框架Hippy
Hippy一看就是淘寶Weex的對標專案，Kpi功能全面壓制，所以官方支持 React 和 Vue 兩種主流前端框架，在Weex2019年實質停更后發布，要不要這么卷？
Hippy 2.x 架構主要分成三層，UI(JS) 層 Hippy-React 和 Hippy-Vue 負責驅動 UI 指令生成；中間層 C++ HippyCore 負責抹平平臺差異性和提供高性能模塊；渲染層 Android 和 iOS 負責提供終端底層模塊、組件，并與布局引擎通信，
對Weex慘遭遺棄，我上次就說過：「ReactNative提供工具，Weex提供框架，將平臺差異化屏蔽（Write Once, Run Everywhere），所以Weex則注定功能相對弱小，并且坑比較多，」Weex最終下馬也是必然的，淘寶又發布升級版北海，為了實作（Write Once, Run Everywhere），它采用自繪，而且是基于Flutter自繪，
所以Hippy3.x就一如既往的Kpi功能層層加碼，很有騰訊風格，在未來的 3.x 中業務與渲染層中的具體實作可根據用戶實際場景進行切換：業務層上不再局限于 JS 驅動，還可選擇（如：DSL/Dart/WASM 等）其它語言進行驅動；在渲染層中，渲染引擎除了支持現有原生（Native）渲染之外，還可以選擇其他渲染 Renderer，如 Flutter(Voltron) 渲染，
Kraken 北海
「Kraken 北海」是一款高性能Web渲染引擎，底層基于 Flutter 進行渲染，
Kraken 不限制上層開發者使用的框架，無論你是使用 Vue 、Rax 還是 React 都可以開發 Kraken 應用，
Kraken 的 runtime 通過 JS Engine Binding 的方式提供了一系列 Web 標準的 API 介面，呼叫相應 API 會執行相關邏輯并創建一系列需要發送給 Dart 層處理的指令，
Kraken 其實就是一個小程式平臺，而且追求全平臺完全一致，我雖然認為各平臺不一致是很自然的事情，但是也表示理解，畢竟別人吹牛有當真的傳統（KFC表示認同），
Kraken 現在也是一個小號瀏覽器，所以它的主要作業就是摳標準，畢竟它是一款基于 W3C 標準的高性能渲染引擎，
最后，我勸淘寶領導定Kpi要理智些，畢竟Hippy4我還蠻期待的，
Hummer
滴滴出品的超輕量級動態化跨端開發框架，主打輕量和實用，
Hummer 以 JS 引擎為基石，目前已支持 JavaScriptCore、Hermers、QuickJS 等業內知名 JS 引擎（這里本來還有個V8的，我洗掉了，原始碼里面沒有，Kpi需要），再配合經過調優的 Yoga 布局引擎，抹平了兩端視圖布局差異（性能更佳的自研布局引擎開發中），順便提一下，Hippy采用V8（功能更強）自研布局引擎（性能更佳），
Hummer 的特點是拋棄了業界其他動態化跨端框架普遍使用的DSL層和VDOM層，因此原生 Hummer 不具備前端開發常用的回應式編程的能力，但同時換來的是接近原生開發的體驗和性能，再以原生 Hummer 為基礎，在此之上開發了一套基于MVVM架構的開發框架 —— Tenon，通過 Tenon，可以把使用 Vue/React 撰寫的代碼，轉換成原生 Hummer 的代碼，
Hummer也是一個小程式平臺，而且超輕量，如果想要無限提升自己APP的能力，可以考慮嵌入Hummer，
總結
Web移動前端框架正在迎來第三個高速發展期，各類框架得到極大繁榮，
個人在具體專案的貢獻已經微乎其微了，創新、架構創新是唯一制勝的手段，這也是我看好React的根本原因，
最后，還是想做點微不足道的探索，現在前端組件庫層出不窮，更換組件庫帶來的代價有點大，想創建一個框架，來實作上次說的組件公約數和公倍數，無縫切換組件庫，理論上支持所有組件庫 ，也能為后來者提供彎道超車的機會，我想大廠可能沒有需求，也不會愿意發布這種框架，畢竟都是平臺部門說了算，
這個庫就是useMobile，當然分為useMobileReact和useMobileVue，下次先發布useMobileReact，等我發布后，再來填上面表中缺的推薦度，
<全文完>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/445566.html
標籤：其他