2013阿里技術(shù)嘉年華hybrid組建實(shí)踐-windvane項(xiàng)目簡(jiǎn)述it168文庫(kù)

Hybrid組件實(shí)踐— WindVane項(xiàng)目簡(jiǎn)述宗心/于佳

顏垣/曲子深Web交互體驗(yàn)靈活UI組件和布局易于理解和使用通用的開(kāi)發(fā)技術(shù)，與平臺(tái)無(wú)關(guān)開(kāi)發(fā)效率，資源有整套解決方案Native用戶體驗(yàn)高性能符合平臺(tái)特性計(jì)算資源豐富GPS，Camera等硬件特性存儲(chǔ)，網(wǎng)絡(luò)Web

vs.Native動(dòng)態(tài)部署插件化（客戶端）降低開(kāi)發(fā)成本（前端）多平臺(tái)統(tǒng)一體驗(yàn)（交互運(yùn)營(yíng)）解決什么問(wèn)題？WindVane是什么？WindVane提供的現(xiàn)有功能

1）可定制化UI組件，包含了一個(gè)可以直接使用的UIViewController。

2）資源本地緩存，資源預(yù)置打包服務(wù)。

3）Wap與本地功能模塊通信交互。

4）Wap調(diào)用本地功能的JSBridge通信服務(wù)。

5）>25個(gè)基于wap淘寶站點(diǎn)的Hybrid組件。

6）可自選擇SDK接入層次的API。從實(shí)際出發(fā)，從各個(gè)客戶端出發(fā)，從實(shí)踐中完善功能，在實(shí)踐中思考與完善windvane淘寶主客戶端天貓客戶端一淘客戶端聚劃算客戶端主客戶端已使用場(chǎng)景有愛(ài)等頁(yè)面的直接接入，以及早期版本中的直充模塊，還有現(xiàn)在的微淘詳情頁(yè)配合全局導(dǎo)航規(guī)則下的攔截規(guī)則通過(guò)jsbridge針對(duì)native頁(yè)面或本地功能調(diào)用

除此之外：1.使用了全局的cache策略，并支持預(yù)置打包的cache策略，以減少頁(yè)面的讀取時(shí)間。2.默認(rèn)定制了加載控制，前進(jìn)后退等導(dǎo)航功能，也可在此基礎(chǔ)上定制webview的UI3.最新接入多個(gè)windvane.js的相關(guān)函數(shù)，用以調(diào)用本地native方法，包含地理位置服務(wù)，搖一搖功能，跨域cookies等方案。4.hybrid組件基于手機(jī)淘寶站點(diǎn)，將wap站點(diǎn)的業(yè)務(wù)模塊進(jìn)行包裝，形成Hybrid的協(xié)議化方式組件。通過(guò)協(xié)議化標(biāo)準(zhǔn)化的方式提供給客戶端使用。服務(wù)端的改動(dòng)將不會(huì)導(dǎo)致客戶端的不可用。例如waplugin://shoppingcart其他的思路—支付寶實(shí)踐TODOList:1.首頁(yè)H5化，經(jīng)歷了pagekit這種native方案本地渲染的規(guī)則后，使用H5化是否能解決多平臺(tái)運(yùn)營(yíng)統(tǒng)一的問(wèn)題，同時(shí)亦需要關(guān)注性能。2.基于本地Html頁(yè)面的Hybrid插件化，類似支付寶客戶端的方案，插件化的動(dòng)態(tài)更新可用性等等，亦需要保證用戶體驗(yàn)3.基于Hybrid的全面降級(jí)方案。經(jīng)歷過(guò)雙十一的沖擊，手機(jī)客戶端在此類特殊時(shí)期能否保證使用hybrid的降級(jí)方案保證手機(jī)端當(dāng)天的可用性。4.Webview主動(dòng)進(jìn)行web頁(yè)面的js注入，保證外鏈也可以享有windvane函數(shù)的功能。1.首頁(yè)H5化，經(jīng)歷了pagekit這種native方案本地渲染的規(guī)則后，使用H5化是否能解決多平臺(tái)運(yùn)營(yíng)統(tǒng)一的問(wèn)題，同時(shí)亦需要關(guān)注性能。2.基于本地Html頁(yè)面的Hybrid插件化，類似支付寶客戶端的方案，插件化的動(dòng)態(tài)更新可用性等等，亦需要保證用戶體驗(yàn)3.基于Hybrid的全面降級(jí)方案。經(jīng)歷過(guò)雙十一的沖擊，手機(jī)客戶端在此類特殊時(shí)期能否保證使用hybrid的降級(jí)方案保證手機(jī)端當(dāng)天的可用性。4.Webview主動(dòng)進(jìn)行web頁(yè)面的js注入，保證外鏈也可以享有windvane函數(shù)的功