写点什么

冯森林:手机淘宝中的那些 Web 技术

2014 年 7 月 14 日

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』行为。

2014 年 7 月 14 日 07:5818739
用户头像
郭蕾 做有意思的事情!

发布了 210 篇内容, 共 109.6 次阅读, 收获喜欢 30 次。

关注

评论

发布
暂无评论
发现更多内容

特权访问管理(PAM)即服务

龙归科技

云上接单不空跑 京东云助力“佬司机”为货运物流业降本增效

CECBC区块链专委会

京东云

iOS--面试题:多线程

ios 面试 多线程

全国沿海港口首个区块链木材业务服务平台上线试运行,“区块链+港口”撬动数千万元“福利”

CECBC区块链专委会

港口

每天学一个 Linux 命令:dnf

Machine Gun

Linux 网络安全 渗透测试 WEB安全

硬核!阿里内部这份《Java面试核心知识手册》在Github上已获赞高达89.7K!

Java架构之路

Java 程序员 架构 面试 编程语言

spring中让你眼前一亮的代码技巧

AI乔治

Java spring 架构 微服务

合约跟单交易系统开发搭建

薇電13O25249123

数字货币

想来百万流量技术公众号发布文章吗? InfoQ 开放内容平台了!

InfoQ 的朋友们

活动专区 InfoQ 的朋友们

从中国企业进入IEC最高决策机构,看科技领先的产业价值与用户价值

脑极体

入职字节跳动那一天,我哭了(蘑菇街被裁,奋战7个月拿下offer)

Java架构追梦

Java 架构 字节跳动 面试 面试经历

一个CURD三年的Java程序员刷完这份《阿里面试指南(恒山版)》,居然斩获了十七个offer

Java架构之路

Java 程序员 架构 面试 编程语言

一篇文章了解CI/CD管道全流程

禅道项目管理

DevOps 持续集成 持续交付

HikariCP-技术专题-配置介绍和使用

李浩宇/Alex

卧槽,误删数据库了,会被开除吗?

AI乔治

Java 数据库 sql 架构 SQL语法

GitHub持续霸榜!2021年Java核心知识:面试突击版

Java架构之路

Java 程序员 架构 面试 编程语言

IPFS矿机配置要求有哪些?IPFS矿机有哪些好的品牌?

投资矿机v:IPFS1234

IPFS矿机有哪些好的品牌 IPFS矿机配置要求有哪些

代码回现 | 如何实现交易反欺诈?

VoltDB

数据分析 金融科技 VoltDB

如果以这样的方式,你愿参与到碳普惠行动中吗?

CECBC区块链专委会

区块链

小厂逆袭美团|5年经验|一二三面经,已拿offer|

Java架构追梦

Java 架构 面试经历 面试题总结 美团Offer

APM-技术专题-监控系统选型

李浩宇/Alex

APM 监控

聪明人的训练(十四)

Changing Lin

四月日更

IPFS挖矿是不是合法的?IPFS有什么投资价值?

投资矿机v:IPFS1234

IPFS挖矿是不是合法的 IPFS有什么投资价值

当造车成为风潮,谁帮助“造车党”连接未来?

脑极体

自学Java走进阿里,仅用了六个月,他是怎么做到的?

Java架构师迁哥

想来百万流量技术公众号发布文章吗? InfoQ 开放内容平台了!

InfoQ写作平台官方

活动专区

2021金三银四:狂刷398道Java最新MySQL笔记;成功收获9个Offer

比伯

Java MySQL 编程 架构 计算机

基础到源码一键搞定:阿里大牛手码651K字的JDK源码速成笔记太强了!

Java王路飞

Java 源码 程序员 架构 面试

架构实战营 - 模块 2- 作业

carl

架构实战营

理论 + 标准 + 工程 —— 阿里云视频云编码优化的思考与发现

阿里云视频云

阿里云 视频编码 视频算法 视频处理

工业互联网的脖子被卡死了?

浪潮云

工业互联网

演讲经验交流会|ArchSummit 上海站

演讲经验交流会|ArchSummit 上海站

冯森林:手机淘宝中的那些Web技术-InfoQ