Native APP與Web APP的技術融合已經逐漸成為一種趨勢，使用標準的Web技術來開發應用中的某些功能，不僅可以降低開發成本，同時還可以方便的進行功能迭代更新。但是如何保證Web APP的流暢性也一直是業內討論的熱點。InfoQ此次專訪了手機淘寶客戶端高級技術專家馮森林來談談手機淘寶在Web技術方面的一些實踐經驗。

淘寶手機客戶端是否使用了HTML5技術？能簡單介紹下嗎？

馮森林：手機淘寶大量使用了Web技術，但對于HTML5，由于兼容性的要求，我們相對比較保守，使用到的特性并不多。主要是一些與觸屏體驗相關的HTML5特性，大部分運用在基礎JS庫中，業務開發直接使用的場景不多。優點在于可以更好的支持一些優化的體驗，充分發揮新技術優勢和移動端獨有的能力。缺點也很明顯，兼容性上需要考慮較多的適配問題。

我們知道Web頁面與原生的頁面在性能上還是有很大差距的，手機淘寶是如何處理Web頁面的體驗瓶頸的?

馮森林：通過使用緩存技術，可以在再次加載頁面（及用到的資源）時避免緩慢和不可靠的網絡請求，從本地緩存加載基本可以做到即時完成，接近于原生應用的加載體驗。為了解決首次加載，我們在緩存機制的基礎上引入了預緩存機制（采用與AppCache一致的協議），提前將需要的頁面及資源緩存到本地，即使在用戶首次打開時，也相當于打開已經緩存過的頁面。

在Web頁面中不可避免的會調用一些Native的功能，手機淘寶是如何實現的？

馮森林：我們采取了類似于PhoneGap的實現（但更輕量級），在Android和iOS兩個平臺上分別實現了JsBridge，在JavaScript的命名空間內創建可映射到native對象的代理。并在業界通行的實現基礎上，我們還加入了一些安全增強和保護機制，封堵常見的JS注入漏洞。

看來手機淘寶在HTML頁面方面做了大量的技術投入，能分享下你們的經驗嗎？

馮森林：其實，無論是緩存還是網絡方面的優化，都是在傳統Web開發領域內已經相對成熟的實踐。在App內，由于我們所能掌控的部分大幅度的下移，能影響一部分以往受制于瀏覽器實現的技術層次，所以可以在這兩方面做的更多更深入。但是兼容Web的既有標準和實踐是我們做這些優化的基本前提，比如使用AppCache協議支持預緩存，這樣有助于前端技術和實踐的跨平臺兼容和復用。

淘寶自己實現的WebView 緩存機制模塊同時兼容iOS 和 Android嗎？ 能否具體講一下大概的實現思路？圖片緩存有特殊處理嗎？

馮森林：是的，在兩個平臺上，我們都采用了相似的實現。實現思路上完全參照標準的HTTP Cache-Control協議，在一些特定的場景下使用ETag。圖片與API采用一致的緩存實現，唯服務端的緩存策略配置不同而已。

手機淘寶開發Web頁面時有沒有用到過一些開源框架？如果有自研框架，是否考慮開源？

馮森林：手機淘寶中使用到的大部分是前端業界成熟的開源框架，如JQuery、Mustache，也有一些我們自己構建的框架，如已經開源的Kissy。基本上，除了對接私有設計的框架之外，我們都優先考慮使用成熟的開源項目，并且將我們的補充反饋給開源社區。

淘寶對安全性要求很高，請問在Web與Native交互的過程中，是否進行過一些加密和其它的處理？

馮森林：Web與Native的交互，本身還是受到OS安全性保護的。無論在Android還是iOS下，這都是App內部的通信通道，因此在非越獄/ROOT的設備上不存在已知的安全風險。由于越獄和ROOT在國內環境中的普遍性，所以在安全問題上，我們整體性的策略是將整個客戶端視同安全藩籬較低的終端，從云端通信及行為分析上去強化安全保護。比如我們已經在Web容器中加入的『人機識別』模塊，可有效識別各種利用Web頁面和接口進行的自動『刷XX』行為。