2016年8月26-27日，由51CTO.com主辦的【W(wǎng)OT2016移動(dòng)互聯(lián)網(wǎng)技術(shù)峰會(huì)】在北京粵財(cái)JW萬(wàn)豪酒店隆重召開(kāi)。自2012年以來(lái)，WOT品牌大會(huì)秉承專(zhuān)注技術(shù)、服務(wù)技術(shù)人員的理念已經(jīng)成功舉辦十一屆，不僅積累了大量的專(zhuān)家資源，更獲得廣大IT從業(yè)者和技術(shù)愛(ài)好者的認(rèn)可和好評(píng)，并成為業(yè)界重要的技術(shù)分享及人脈拓展平臺(tái)。

在本次WOT2016移動(dòng)互聯(lián)網(wǎng)技術(shù)峰會(huì)上，淘寶移動(dòng)平臺(tái)基礎(chǔ)平臺(tái)部負(fù)責(zé)人吳志華分享了主題為《Weex:JS&Web能力拓展萬(wàn)物互聯(lián)的探索》的演講，具體包括Weex項(xiàng)目簡(jiǎn)介、特點(diǎn)和開(kāi)發(fā)體驗(yàn)以及那些阿里巴巴為什么要做和怎么做Weex背后基于業(yè)界趨勢(shì)的思考。會(huì)后，51CTO記者采訪了吳老師，他就Weex項(xiàng)目的發(fā)展及開(kāi)源現(xiàn)狀、產(chǎn)品的核心競(jìng)爭(zhēng)力、存在的技術(shù)難點(diǎn)和未來(lái)1-2年的發(fā)展目標(biāo)等話題進(jìn)行了詳細(xì)闡述。

嘉賓簡(jiǎn)介

[[170643]]

吳志華(阿里花名天施)，阿里巴巴資深無(wú)線技術(shù)專(zhuān)家，淘寶移動(dòng)平臺(tái)基礎(chǔ)平臺(tái)部負(fù)責(zé)人，國(guó)內(nèi)較早投身移動(dòng)浪潮的老司機(jī)，參與業(yè)界多個(gè)超級(jí) App 架構(gòu)和研發(fā)工作，2014年底加入阿里巴巴，目前負(fù)責(zé)阿里移動(dòng)基礎(chǔ)技術(shù)平臺(tái)、Weex 項(xiàng)目、百川移動(dòng)云等研發(fā)建設(shè)工作。Archsummit深圳2015移動(dòng)專(zhuān)題優(yōu)秀出品人、QCon上海2016 移動(dòng)專(zhuān)題出品人。

Weex項(xiàng)目的發(fā)展現(xiàn)狀

Weex項(xiàng)目是以Web的方式來(lái)開(kāi)發(fā)Native APP，遵循Write once, run everywhere的原則。它在阿里內(nèi)部，已經(jīng)從一個(gè)技術(shù)項(xiàng)目變成一種技術(shù)生態(tài)，由多個(gè)部門(mén)一起來(lái)完成。吳老師所在團(tuán)隊(duì)負(fù)責(zé)Weex內(nèi)核、前端JSFramework，包括工具體系和下層的V8引擎，Weex內(nèi)核研發(fā)機(jī)制可以比肩主流瀏覽器的內(nèi)核機(jī)制，這是Weex跟同類(lèi)競(jìng)品的***區(qū)別。因?yàn)橥袥](méi)有做***瀏覽器的經(jīng)驗(yàn)，可能不能很好保證內(nèi)核的穩(wěn)定性等，而這塊Weex和 UC 瀏覽器有很好的合作。除了前端的JS&Web框架，他們團(tuán)隊(duì)的成員還在做UI庫(kù)，就是基于SUI有一個(gè)Weex版本NEXT，上面有輕量級(jí)的框架，對(duì)于一些商家會(huì)提供企業(yè)級(jí)的解決方案。還有就是移動(dòng)端實(shí)現(xiàn)互動(dòng)的能力，游戲的能力、3D的能力，VR的能力等。

基于這些方面，阿里巴巴已經(jīng)初步形成了一個(gè)技術(shù)生態(tài)，從數(shù)據(jù)上來(lái)看，當(dāng)他們4月21日宣布開(kāi)源內(nèi)測(cè)的當(dāng)天就有大量的開(kāi)發(fā)者涌入，兩周內(nèi)就有5000多開(kāi)發(fā)者申請(qǐng)。到6月30日正式開(kāi)源時(shí)，Weex當(dāng)天登上github trending榜榜首，開(kāi)源***周都在trending榜上。截止8.26已經(jīng)達(dá)到5500多個(gè)STAR。另外，整個(gè)項(xiàng)目從來(lái)自外部的PR來(lái)看，數(shù)據(jù)上500的PR，來(lái)自外部占到1/5的比例。開(kāi)發(fā)者與項(xiàng)目組成員經(jīng)常在issue里討論技術(shù)需求，有些已經(jīng)在公司的業(yè)務(wù)正式用上Weex并業(yè)務(wù)并上線。這些都說(shuō)明Weex的開(kāi)源已經(jīng)初步形成一個(gè)健康的生態(tài)體系。

Weex與開(kāi)發(fā)者使用的同類(lèi)工具相比較的核心競(jìng)爭(zhēng)力

談到Weex項(xiàng)目與競(jìng)品特點(diǎn)的區(qū)別時(shí)，吳老師主要談到如下五點(diǎn)：

***，他們堅(jiān)持在中國(guó)的互聯(lián)網(wǎng)環(huán)境下，讓一份代碼在三個(gè)端(Android、iOS和H5)的運(yùn)行體驗(yàn)一致，幫助創(chuàng)業(yè)者節(jié)省成本。

第二，真正做到瀏覽器內(nèi)核級(jí)的穩(wěn)定性和研發(fā)機(jī)制，最終實(shí)現(xiàn)可收斂。

第三，實(shí)現(xiàn)高性能和持續(xù)穩(wěn)定性的運(yùn)行保障機(jī)制。

第四是在中國(guó)場(chǎng)景下，Weex支持靈活的嵌入方式。它可以是一個(gè)頁(yè)面，也可以構(gòu)建一個(gè)APP，也可以成為一個(gè)內(nèi)核APP的界面。Weex團(tuán)隊(duì)堅(jiān)信在中國(guó)，先把頁(yè)面做好，再做好整個(gè)APP，對(duì)開(kāi)發(fā)者工程體系和新的框架影響將非常大，這也是他們的***優(yōu)勢(shì)。

***一點(diǎn)是阿里巴巴是全世界范圍內(nèi)***規(guī)模復(fù)雜業(yè)務(wù)場(chǎng)景下，應(yīng)用移動(dòng)客戶端動(dòng)態(tài)化技術(shù)的公司，無(wú)論是手淘航母還是集團(tuán)APP正處于業(yè)務(wù)逐步Weex化的階段，今年手淘、天貓的大促會(huì)場(chǎng)基本也都是由Weex來(lái)承載。經(jīng)過(guò)這半年的實(shí)踐，不斷地嘗試和放大應(yīng)用范圍、復(fù)雜度，Weex項(xiàng)目團(tuán)隊(duì)已經(jīng)探到了并解決了在大規(guī)模復(fù)雜應(yīng)用場(chǎng)景的一系列技術(shù)難題，發(fā)現(xiàn)了不少同類(lèi)競(jìng)品沒(méi)有發(fā)現(xiàn)和解決的問(wèn)題。

阿里淘寶的雙十一大促，面對(duì)流量瞬發(fā)、網(wǎng)絡(luò)擁堵和商戶的需求，特別是在移動(dòng)端購(gòu)物行為的養(yǎng)成過(guò)程中，如何更好地滿足用戶的購(gòu)物體驗(yàn)?

吳老師講到雙十一是一個(gè)大事件，從大的層面上來(lái)講，這兩年比較關(guān)注的是異地多活，多機(jī)房，就是一個(gè)機(jī)房怎么切換到另一個(gè)機(jī)房。舉例來(lái)說(shuō)，2015年，吳老師主持的阿里統(tǒng)一網(wǎng)絡(luò)接入的ACCS項(xiàng)目，從技術(shù)層面上分為幾個(gè)方面：***個(gè)是在部署層面的容災(zāi)、異地多活。針對(duì)交易的單元化和非交易業(yè)務(wù)的容災(zāi)，防止極端情況的出現(xiàn)。第二個(gè)，支持十億級(jí)設(shè)備接入的網(wǎng)絡(luò)統(tǒng)一接入層和對(duì)突發(fā)流量設(shè)置防刷限流機(jī)制，防止流量順發(fā)和惡意請(qǐng)求。第三是客戶端層面的靈活請(qǐng)求策略和云端一體的控制能力，在極端情況可以對(duì)客戶端請(qǐng)求頻率和策略進(jìn)行控制，在盡量保證高優(yōu)先級(jí)請(qǐng)求的前提下進(jìn)行柔性處理。

還有移動(dòng)端購(gòu)物這塊，今年他們嘗試比較多，目的是通過(guò)一個(gè)新的互動(dòng)形式讓大家有不一樣的互動(dòng)購(gòu)物體驗(yàn)，使人和人之間的距離拉得更近，既可以看到主播展示商品，跟大家互動(dòng)，又在內(nèi)部通過(guò)很多技術(shù)實(shí)現(xiàn)來(lái)保證用戶購(gòu)物的順暢體驗(yàn)。具體涉及的技術(shù)有：

1.保證購(gòu)物過(guò)程的性能和穩(wěn)定性，相關(guān)指標(biāo)有啟動(dòng)到首頁(yè)渲染完成的時(shí)間分布占比、Crash率、頁(yè)面打開(kāi)的耗時(shí)、內(nèi)存、幀率。

2.網(wǎng)絡(luò)傳輸1秒鐘法則和請(qǐng)求成功率持續(xù)優(yōu)化，保障網(wǎng)絡(luò)傳輸?shù)目煽勘剡_(dá)。

3.H5和Weex的秒開(kāi)，提供用戶體驗(yàn)和提高速度。

4.多媒體和直播等內(nèi)容升級(jí)、buy+等創(chuàng)新探索，帶給用戶不一樣的購(gòu)物體驗(yàn)。

5.***就是淘寶談得比較多的社區(qū)化和內(nèi)容化，讓消費(fèi)者在購(gòu)物的同時(shí)購(gòu)物決策更多樣化。

團(tuán)隊(duì)遇到的重要技術(shù)更新和技術(shù)難點(diǎn)

在Weex項(xiàng)目的開(kāi)發(fā)過(guò)程中，Weex項(xiàng)目遇到的重要技術(shù)更新包括：

1.性能迭代優(yōu)化。持續(xù)一年的性能迭代，緯度細(xì)化到啟動(dòng)、首屏渲染、滾動(dòng)幀率、內(nèi)存及增量、CPU峰值/均值/靜默，同時(shí)針對(duì) Android/iOS的低/中/高端機(jī)不同機(jī)型多次迭代優(yōu)化性能，確保即使在Android 低端機(jī)上也能擁有接近native的體驗(yàn)。

2.前端語(yǔ)法的持續(xù)迭代。語(yǔ)法糖和能力更豐富，更方便開(kāi)發(fā)者，新增支持inline event、基于WebPack的loader機(jī)制、computedproperty、repeat語(yǔ)法擴(kuò)展等。

3.頁(yè)面級(jí)導(dǎo)航方案。通過(guò)Weex Navigator組件，支持大規(guī)模線上活動(dòng)間的跳轉(zhuǎn);通過(guò)TabBar提升頁(yè)面切換的體驗(yàn)。

4.調(diào)試工具Devtool：通過(guò) Chrome Devtool直接調(diào)試 Weex Android/iOS代碼，支持 Element(BoxModel/NativeView)、Console log、Network、ScreenCast;同時(shí)支持多設(shè)備和多 APP 同時(shí)調(diào)試，支持JS代碼斷點(diǎn)調(diào)試。

同時(shí)，吳老師詳細(xì)分享了其中一個(gè)重要的技術(shù)解決方案：頁(yè)面級(jí)導(dǎo)航方案

初始選擇：在單頁(yè)多視圖導(dǎo)航和多頁(yè)面導(dǎo)航之間，項(xiàng)目組選擇優(yōu)先實(shí)現(xiàn)多頁(yè)面導(dǎo)航，更加符合大規(guī)模應(yīng)用的場(chǎng)景，減少頁(yè)面間的耦合，提升整體的穩(wěn)定性。

技術(shù)方案包括：

1.導(dǎo)航控制器

(1)NavigationBar:棧式導(dǎo)航，支持 push/pop，可定制的NavigationBar樣式。

(2)TabBar:引入embed組件，支持內(nèi)嵌多級(jí)Weex container instance(以下簡(jiǎn)稱(chēng) instance)，實(shí)現(xiàn)可由前端自定義的TabBar組件，且instance之間可相互通訊;TabBar具有高度的可定制性，多級(jí)tab頁(yè)面對(duì)應(yīng)的源文件分離并可按需加載。

2.應(yīng)用生命周期

(1)從頁(yè)面的維度考慮，基本可分為init、ready、viewappear、viewdisappear和destroy幾個(gè)關(guān)鍵時(shí)間節(jié)點(diǎn)。

(2)從應(yīng)用角度考慮，又會(huì)融入前后臺(tái)相關(guān)foreground、background以及內(nèi)存相關(guān)memoryWarning等，需要暴露以上注冊(cè)接口給前端來(lái)做必要的操作。

3. 數(shù)據(jù)通訊

(1)通過(guò)消息分發(fā)的方式，建立消息監(jiān)聽(tīng)模式，優(yōu)點(diǎn)是隔離性比較好，無(wú)需關(guān)注對(duì)象的上下文，比較適合多級(jí)頁(yè)面之間進(jìn)行通訊。

(2)建立 instance 之間上下文之間的關(guān)系，適合內(nèi)嵌instance的場(chǎng)景。

Weex項(xiàng)目很大的技術(shù)難點(diǎn)是大規(guī)模復(fù)雜場(chǎng)景下的性能和穩(wěn)定性保障、持續(xù)的三端體驗(yàn)一致的保障機(jī)制，尤其是雙十一場(chǎng)景下Weex的穩(wěn)定性。

這個(gè)其實(shí)是一個(gè)復(fù)雜的系統(tǒng)工程問(wèn)題，從V8/JSCore引擎的優(yōu)化，從native層性能調(diào)優(yōu)再到上層的JSFrm框架的性能和易用性，配套CI和自動(dòng)化測(cè)試機(jī)制。項(xiàng)目組希望建立一套類(lèi)似Webkit內(nèi)核的性能穩(wěn)定性保障機(jī)制，保障三端體驗(yàn)一致的機(jī)制(渲染、排版體驗(yàn)一致，提供圖形化自動(dòng)對(duì)比能力)、前端框架配套的Profile、Lint、內(nèi)存泄露排查工具，在Weex建立起來(lái)一套自動(dòng)化的平臺(tái)研發(fā)保障機(jī)制。這樣才能保障Weex類(lèi)似WebKit一樣能夠持續(xù)交付穩(wěn)定可靠的版本，這個(gè)也是Weex跟競(jìng)品在理念上的大差異，可以走的更穩(wěn)健一些。

未來(lái)1-2年，Weex項(xiàng)目的發(fā)展目標(biāo)

Weex項(xiàng)目的發(fā)展目標(biāo)分為兩個(gè)方面，對(duì)內(nèi)和對(duì)外，對(duì)內(nèi)的一個(gè)基本目標(biāo)是在8-12月，阿里巴巴移動(dòng)業(yè)務(wù)全部實(shí)現(xiàn)Weex化。希望Weex能力不僅僅局限在手機(jī)端，也能夠拓展到萬(wàn)物互聯(lián)多個(gè)設(shè)備端。對(duì)外來(lái)看，Weex能不能成為業(yè)界真正值得信賴(lài)，真正被開(kāi)發(fā)者認(rèn)可的移動(dòng)端跨平臺(tái)的解決方案，這個(gè)挑戰(zhàn)也很大。實(shí)現(xiàn)過(guò)程是把過(guò)去前端優(yōu)秀的基礎(chǔ)能力、工程體系完全繼承到移動(dòng)端，把整個(gè)一套方案開(kāi)源開(kāi)放給業(yè)界，和業(yè)界開(kāi)發(fā)者一起來(lái)共建，追蹤并過(guò)渡成業(yè)界，最終將Weex建設(shè)成為大家信賴(lài)的萬(wàn)物互聯(lián)設(shè)備的技術(shù)解決方案。