馮森林:手機淘寶中的那些Web技術
Native APP與Web APP的技術融合已經逐漸成為一種趨勢,使用標準的Web技術來開發應用中的某些功能,不僅可以降低開發成本,同時還可以方便的進行功能迭代更新。但是如何保證Web APP的流暢性也一直是業內討論的熱點。InfoQ此次專訪了手機淘寶客戶端高階技術專家馮森林來談談手機淘寶在Web技術方面的一些實踐經驗,另外作為ArchSummit深圳2014大會《移動網際網路,一浪高過一浪》專題的講師,馮森林將會分享手機淘寶的客戶端架構探索之路。
InfoQ:淘寶手機客戶端是否使用了HTML5技術?能簡單介紹下嗎?
馮森林:手機淘寶大量使用了Web技術,但對於HTML5,由於相容性的要求,我們相對比較保守,使用到的特性並不多。主要是一些與觸屏體驗相關的HTML5特性,大部分運用在基礎JS庫中,業務開發直接使用的場景不多。優點在於可以更好的支援一些優化的體驗,充分發揮新技術優勢和移動端獨有的能力。缺點也很明顯,相容性上需要考慮較多的適配問題。
InfoQ:我們知道Web頁面與原生的頁面在效能上還是有很大差距的,手機淘寶是如何處理Web頁面的體驗瓶頸的?
馮森林:通過使用快取技術,可以在再次載入頁面(及用到的資源)時避免緩慢和不可靠的網路請求,從本地快取載入基本可以做到即時完成,接近於原生應用的載入體驗。為了解決首次載入,我們在快取機制的基礎上引入了預快取機制(採用與AppCache一致的協議),提前將需要的頁面及資源快取到本地,即使在使用者首次開啟時,也相當於開啟已經快取過的頁面。
InfoQ:在Web頁面中不可避免的會呼叫一些Native的功能,手機淘寶是如何實現的?
馮森林:我們採取了類似於PhoneGap的實現(但更輕量級),在Android和iOS兩個平臺上分別實現了JsBridge,在JavaScript的名稱空間內建立可對映到native物件的代理。並在業界通行的實現基礎上,我們還加入了一些安全增強和保護機制,封堵常見的JS注入漏洞。
InfoQ:看來手機淘寶在HTML頁面方面做了大量的技術投入,能分享下你們的經驗嗎?
馮森林:其實,無論是快取還是網路方面的優化,都是在傳統Web開發領域內已經相對成熟的實踐。在App內,由於我們所能掌控的部分大幅度的下移,能影響一部分以往受制於瀏覽器實現的技術層次,所以可以在這兩方面做的更多更深入。但是相容Web的既有標準和實踐是我們做這些優化的基本前提,比如使用AppCache協議支援預快取,這樣有助於前端技術和實踐的跨平臺相容和複用。
InfoQ:淘寶自己實現的WebView 快取機制模組同時相容iOS 和 Android嗎? 能否具體講一下大概的實現思路?圖片快取有特殊處理嗎?
馮森林:是的,在兩個平臺上,我們都採用了相似的實現。實現思路上完全參照標準的HTTP Cache-Control協議,在一些特定的場景下使用ETag。圖片與API採用一致的快取實現,唯服務端的快取策略配置不同而已。
InfoQ:手機淘寶開發Web頁面時有沒有用到過一些開源框架?如果有自研框架,是否考慮開源?
馮森林:手機淘寶中使用到的大部分是前端業界成熟的開源框架,如JQuery、Mustache,也有一些我們自己構建的框架,如已經開源的Kissy。基本上,除了對接私有設計的框架之外,我們都優先考慮使用成熟的開源專案,並且將我們的補充反饋給開源社群。
InfoQ:淘寶對安全性要求很高,請問在Web與Native互動的過程中,是否進行過一些加密和其它的處理?
馮森林:Web與Native的互動,本身還是受到OS安全性保護的。無論在Android還是iOS下,這都是App內部的通訊通道,因此在非越獄/ROOT的裝置上不存在已知的安全風險。由於越獄和ROOT在國內環境中的普遍性,所以在安全問題上,我們整體性的策略是將整個客戶端視同安全藩籬較低的終端,從雲端通訊及行為分析上去強化安全保護。比如我們已經在Web容器中加入的『人機識別』模組,可有效識別各種利用Web頁面和介面進行的自動『刷XX』行為。
本文轉自ljianbing51CTO部落格,原文連結:http://blog.51cto.com/ljianbing/1623828 ,如需轉載請自行聯絡原作者
相關文章
- Web技術:易趣 vs 淘寶 ztWeb
- 盤點:那些安卓手機陣營引領的主流技術安卓
- 軟體技術的森林時代 (轉)
- 淘寶技術發展
- 追捕的OICQ探測技術 ---馮志宏 [撰稿] (轉)
- 技術男對付淘寶控老婆不完全手冊
- 致那些逝去的技術
- 淘寶的十年技術之路
- 還原黑客電影中那些hacking技術的真相黑客
- 手機史上九大技術突破
- 淘寶小部件:全新的開放卡片技術!
- 那些年的體驗技術部
- 手機淘寶官方資料:2013年上半年手機淘寶運營資料
- 小米手機太低端?雷軍:有技術含量的
- 我在秋招中踩過的那些坑|掘金技術徵文
- web的攻擊技術Web
- 隨機森林的祕密隨機森林
- 直播預告 | “大淘寶技術論壇”太好逛了,背後的技術分享
- 使用畫素流技術在iOS手機中卡死怎麼辦?iOS
- Web前端AR技術探索-導航中的應用Web前端
- 傳統 Web 應用中的身份驗證技術Web
- 手機淘寶的flexible設計與實現Flex
- 我面試過的那些爛技術大哥面試
- 米哈遊弋振中:從手機走向主機,《原神》主機版渲染技術分享
- 技術部落格那些事兒
- 技術戰略那些事兒
- 淘寶客?CPS技術是怎麼實現的?
- ios開發者談談技術面試那些坑 | 掘金技術徵文iOS面試
- 程式設計師技術入股的那些坑程式設計師
- 天貓、淘寶運營資料抓取技術概述
- 正在被人工智慧技術顛覆的手術機器人人工智慧機器人
- 凱文凱利預言顛覆手機的12大技術
- WEB 架構技術Web架構
- 隨機森林和機器學習隨機森林機器學習
- 日本手機那些事:運營商起用機器人賣手機機器人
- 隨機之美,隨機森林隨機森林
- tengine 淘寶開源的web serverWebServer
- 分享手淘過年專案中採用到的前端技術前端