Native APP與Web APP的技術融合已經(jīng)逐漸成為一種趨勢，使用標準的Web技術來開發(fā)應用中的某些功能，不僅可以降低開發(fā)成本，同時還可以方便的進行功能迭代更新。但是如何保證Web APP的流暢性也一直是業(yè)內討論的熱點。InfoQ此次專訪了手機淘寶客戶端高級技術專家馮森林來談談手機淘寶在Web技術方面的一些實踐經(jīng)驗。
淘寶手機客戶端是否使用了HTML5技術？能簡單介紹下嗎？
馮森林：手機淘寶大量使用了Web技術，但對于HTML5，由于兼容性的要求，我們相對比較保守，使用到的特性并不多。主要是一些與觸屏體驗相關的HTML5特性，大部分運用在基礎JS庫中，業(yè)務開發(fā)直接使用的場景不多。優(yōu)點在于可以更好的支持一些優(yōu)化的體驗，充分發(fā)揮新技術優(yōu)勢和移動端獨有的能力。缺點也很明顯，兼容性上需要考慮較多的適配問題。
我們知道Web頁面與原生的頁面在性能上還是有很大差距的，手機淘寶是如何處理Web頁面的體驗瓶頸的?
馮森林：通過使用緩存技術，可以在再次加載頁面（及用到的資源）時避免緩慢和不可靠的網(wǎng)絡請求，從本地緩存加載基本可以做到即時完成，接近于原生應用的加載體驗。為了解決首次加載，我們在緩存機制的基礎上引入了預緩存機制（采用與AppCache一致的協(xié)議），提前將需要的頁面及資源緩存到本地，即使在用戶首次打開時，也相當于打開已經(jīng)緩存過的頁面。
在Web頁面中不可避免的會調用一些Native的功能，手機淘寶是如何實現(xiàn)的？
馮森林：我們采取了類似于PhoneGap的實現(xiàn)（但更輕量級），在Android和iOS兩個平臺上分別實現(xiàn)了JsBridge，在JavaScript的命名空間內創(chuàng)建可映射到native對象的代理。并在業(yè)界通行的實現(xiàn)基礎上，我們還加入了一些安全增強和保護機制，封堵常見的JS注入漏洞。
看來手機淘寶在HTML頁面方面做了大量的技術投入，能分享下你們的經(jīng)驗嗎？
馮森林：其實，無論是緩存還是網(wǎng)絡方面的優(yōu)化，都是在傳統(tǒng)Web開發(fā)領域內已經(jīng)相對成熟的實踐。在App內，由于我們所能掌控的部分大幅度的下移，能影響一部分以往受制于瀏覽器實現(xiàn)的技術層次，所以可以在這兩方面做的更多更深入。但是兼容Web的既有標準和實踐是我們做這些優(yōu)化的基本前提，比如使用AppCache協(xié)議支持預緩存，這樣有助于前端技術和實踐的跨平臺兼容和復用。
淘寶自己實現(xiàn)的WebView 緩存機制模塊同時兼容iOS 和 Android嗎？ 能否具體講一下大概的實現(xiàn)思路？圖片緩存有特殊處理嗎？
馮森林：是的，在兩個平臺上，我們都采用了相似的實現(xiàn)。實現(xiàn)思路上完全參照標準的HTTP Cache-Control協(xié)議，在一些特定的場景下使用ETag。圖片與API采用一致的緩存實現(xiàn)，唯服務端的緩存策略配置不同而已。
手機淘寶開發(fā)Web頁面時有沒有用到過一些開源框架？如果有自研框架，是否考慮開源？
馮森林：手機淘寶中使用到的大部分是前端業(yè)界成熟的開源框架，如JQuery、Mustache，也有一些我們自己構建的框架，如已經(jīng)開源的Kissy�；旧希藢铀接性O計的框架之外，我們都優(yōu)先考慮使用成熟的開源項目，并且將我們的補充反饋給開源社區(qū)。
淘寶對安全性要求很高，請問在Web與Native交互的過程中，是否進行過一些加密和其它的處理？
馮森林：Web與Native的交互，本身還是受到OS安全性保護的。無論在Android還是iOS下，這都是App內部的通信通道，因此在非越獄/ROOT的設備上不存在已知的安全風險。由于越獄和ROOT在國內環(huán)境中的普遍性，所以在安全問題上，我們整體性的策略是將整個客戶端視同安全藩籬較低的終端，從云端通信及行為分析上去強化安全保護。比如我們已經(jīng)在Web容器中加入的『人機識別』模塊，可有效識別各種利用Web頁面和接口進行的自動『刷XX』行為。