滴滴 WebApp 團(tuán)隊(duì)近日宣布開源 Mpx ，這是一款致力于提高小程序開發(fā)體驗(yàn)的增強(qiáng)型小程序框架。通過 Mpx ，開發(fā)者能夠以最先進(jìn)的 web 開發(fā)體驗(yàn) (Vue + Webpack) 來開發(fā)生產(chǎn)性能深度優(yōu)化的小程序。

Mpx 具有以下一些優(yōu)秀特性：

• 數(shù)據(jù)響應(yīng)特性 (watch/computed)

• 增強(qiáng)的模板語法(動(dòng)態(tài)組件/樣式綁定/類名綁定/內(nèi)聯(lián)事件函數(shù)/雙向綁定等)

• 深度性能優(yōu)化(原生自定義組件/基于依賴收集和數(shù)據(jù)變化的 setData )

• Webpack 編譯( npm/循環(huán)依賴/Babel/ESLint/css 預(yù)編譯/代碼優(yōu)化等)

• 單文件組件開發(fā)

• 狀態(tài)管理( Vuex 規(guī)范/多實(shí)例/可合并)

• 跨團(tuán)隊(duì)合作 (packages)

• 邏輯復(fù)用能力 (mixins)

• 腳手架支持

• 小程序自身規(guī)范的完全支持

• 支付寶小程序的支持

開發(fā)團(tuán)隊(duì)表示，目前業(yè)界主流的小程序框架主要有 WePY、mpvue 和 Taro，這三者都是將其他的語法規(guī)范轉(zhuǎn)譯為小程序語法規(guī)范，我們稱其為轉(zhuǎn)譯型框架。不同于上述三者，Mpx 是一款基于小程序語法規(guī)范的增強(qiáng)型框架，使用 Vue 中優(yōu)秀的語法特性增強(qiáng)了小程序，而不是讓用戶直接使用 vue 語法來開發(fā)小程序，之所以采用這種設(shè)計(jì)主要是基于如下考慮：

• 轉(zhuǎn)譯型框架無法支持源框架的所有語法特性 (如 Vue 模板中的動(dòng)態(tài)特性或 React 中動(dòng)態(tài)生成的 jsx )，用戶在使用源框架語法進(jìn)行開發(fā)時(shí)可能會(huì)遇到不可預(yù)期的錯(cuò)誤，具有不確定性

• 小程序本身的技術(shù)規(guī)范在不斷地更新進(jìn)步，許多新的技術(shù)規(guī)范在轉(zhuǎn)譯型框架中無法支持或需要很高的支持成本，而對(duì)于增強(qiáng)型框架來說只要新的技術(shù)規(guī)范不與增強(qiáng)特性沖突，就能夠直接支持

目前 Mpx 框架已經(jīng)在滴滴內(nèi)部大量使用，支撐了滴滴出行、青桔單車、街兔電單車、營(yíng)銷、車服等業(yè)務(wù)在小程序上的實(shí)現(xiàn)，線上運(yùn)行穩(wěn)定，收到了大量的好評(píng)反饋。未來在對(duì)框架進(jìn)行持續(xù)迭代優(yōu)化的同時(shí)會(huì)持續(xù)跟進(jìn)微信和支付寶最新的技術(shù)標(biāo)準(zhǔn)，同時(shí)也會(huì)將在更多的小程序平臺(tái)上進(jìn)行適配。

由于設(shè)計(jì)初衷和專注點(diǎn)在于增強(qiáng)小程序開發(fā)體驗(yàn)，Mpx 并沒有進(jìn)行跨 H5 甚至是跨 Native 的支持，但現(xiàn)實(shí)業(yè)務(wù)當(dāng)中確實(shí)存在這樣的訴求，未來開發(fā)團(tuán)隊(duì)會(huì)在Mpx 的基礎(chǔ)上對(duì)跨端進(jìn)行一定的嘗試，與此同時(shí)依然會(huì)持續(xù)維護(hù)升級(jí) Mpx ，原因在于跨端意味著靈活性受限及能力的缺失，希望能給用戶提供第二種選擇。

Mpx 與業(yè)內(nèi)主流小程序框架異同對(duì)比