滴滴開源Web移動(dòng)端組件庫cube-ui
- 來源:中國信息化周報(bào) smarty:if $article.tag?>
- 關(guān)鍵字: smarty:/if?>
- 發(fā)布時(shí)間:2017-12-06 11:20
滴滴出行近日宣布開源Web移動(dòng)端組件庫cube-ui,該技術(shù)擁有質(zhì)量可靠、體驗(yàn)極致、標(biāo)準(zhǔn)規(guī)范和強(qiáng)擴(kuò)展性這四大特點(diǎn),并擁有獨(dú)特的后編譯技術(shù)方案幫助大幅優(yōu)化性能。這是繼今年6月開源Virtual APK后,滴滴的又一次開源動(dòng)作。
cube-ui從滴滴業(yè)務(wù)中提煉而來,由滴滴WebApp前端架構(gòu)組開發(fā)和維護(hù)。cube-ui的目標(biāo)是讓移動(dòng)端的開發(fā)更容易,讓開發(fā)人員更加專注于業(yè)務(wù)邏輯的開發(fā),提升研發(fā)效率。
之所以將其開源,滴滴方面透露:“去年底,滴滴WebApp團(tuán)隊(duì)在用Vue.js2.0對業(yè)務(wù)進(jìn)行重構(gòu),并開發(fā)了一套移動(dòng)端組件庫cube-ui支撐業(yè)務(wù)的開發(fā),經(jīng)過了一年多的業(yè)務(wù)考驗(yàn),cube-ui也日趨成熟,好的東西必須要和大家分享,于是我們在今天正式將其開源。”
該項(xiàng)技術(shù)的研發(fā)工程師發(fā)表了經(jīng)驗(yàn)之談:“移動(dòng)端組件庫寫得好不好,就看Picker組件寫得好不好,而cube-ui的Picker是目前所有移動(dòng)端組件庫中實(shí)現(xiàn)最細(xì)致、體驗(yàn)也是最好的,接近原生iOS選擇器的效果。類似的還有IndexList索引列表組件,我們在一些交互的細(xì)節(jié)上都考慮得非常細(xì)致,比如對吸頂標(biāo)題的處理,按壓態(tài)的處理等。”
相較于市面上同類技術(shù),該項(xiàng)目獨(dú)有的后編譯技術(shù)是滴滴前端團(tuán)隊(duì)總結(jié)出的一套優(yōu)化技術(shù)方案。
由于在一個(gè)項(xiàng)目中經(jīng)常會(huì)引用多個(gè)經(jīng)過ES6開發(fā)、Babel編譯發(fā)布的NPM模塊,而Babel編譯則會(huì)產(chǎn)生多份額外代碼。針對該問題,cube-ui組件庫運(yùn)用了后編譯技術(shù)方案,可讓最終使用方引用cube-ui組件庫編譯產(chǎn)生的代碼體積減少,幫助優(yōu)化性能。
滴滴的研發(fā)人員也呼吁越來越多的NPM模塊支持后編譯,這樣應(yīng)用最終編譯后體積才會(huì)更小,后編譯技術(shù)方案效果才會(huì)更好。
未來滴滴的工程師們將持續(xù)對cube-ui迭代和優(yōu)化,包括但不限于以下幾個(gè)方向:豐富組件庫,開發(fā)更多通用組件;支持換膚功能,和UI團(tuán)隊(duì)配合設(shè)計(jì)出幾套皮膚,同時(shí)也支持自定義皮膚能力;支持TypeScript/Flow,由于靜態(tài)類型檢查是未來趨勢,cube-ui也會(huì)考慮對它們的支持。
目前,cube-ui已登錄GitHub,工程師們可戳鏈接查看源碼:https://github.com/didi/cube-ui,也可在滴滴的開源平臺上(https://didi.github.io/)獲取更多信息。
開源文化正在成為滴滴程序員文化的重要一部分,不久前的10月24日程序員節(jié),桔廠宣布成立開源委員會(huì),由高級副總裁章文嵩出任主席。他說:“滴滴除了要為用戶提供優(yōu)秀的產(chǎn)品和良好的體驗(yàn)外,更需要對外輸出滴滴領(lǐng)先的技術(shù),與世界共享我們的智慧,所以我們鼓勵(lì)同學(xué)們積極參與業(yè)界的開源項(xiàng)目,不斷對外輸出內(nèi)部的優(yōu)秀項(xiàng)目。”
