确认过眼神—这么做，才能让移动APP研发效率更高

本文根据2018云栖大会深圳峰会·EMAS专场—移动互联的进化论，阿里巴巴技术专家鬼谣《移动APP研发加速—跨平台解决方案》的演讲整理而成，文中就EMAS跨平台商业化解决方案进行了分享。

移动研发面临的挑战

2016年，有一个观点“中国互联网已经进入下半场”。2017年，我身边几乎所有人都在说“移动互联网已经进入了下半场”。在坐的，各位都是大佬，是不是也这样要求开发同学。希望研发的节奏快，希望业务可以快速验证结果。互联网的下半场，用户的自主性在提高，从产品找用户，到了用户找产品。这个时候，产品的性能和体验显得尤为重要。

2007年，iPhone 2G在美国正式发售。第二年，也就是2008年， Android 1.0版本发布，标志着移动互联网时代的开启。不过有个问题，就是 iOS/Android 开发效率比较低下。于是就有开发者开始尝试使用 Webview 容器，用H5的解决方案来解决。

我翻阅了下历史，貌似phoneGap第一段代码是2008年8月开始写的，那时候 Android 1.0 还未发布，9月份才发布。当时的开发人员早就意识到了Native研发的效率和成本问题。

2011年，phoneGap发布稳定版本。于是，业界开始使用Hybrid混合开发模式。这种模式带来的好处是显而易见的。比如下面的这幅图，我们的H5代码可以跑在多个端，同时也能够利用端上的设备能力。以前浏览器不能进行拍照，这个时候就可以。

不可否认，这是前些年的研发模式创新。但是，我们也发现，H5的性能和体验相对 Native 差的不是一个数量级。

可是，移动互联网的下半场已经到来。用户对产品的体验要求极致。以前我们谈到产品体验，第一个想到的是产品所提供的服务以及产品的颜值。但是，性能往往也关乎体验。比如，页面卡顿，用户就会放弃浏览；页面响应慢，用户也会放弃浏览；应用奔溃，用户会直接放弃APP。比如，一个列表页面，如果用户能往下多滚一些，多浏览一些记录，或许就会促成交易达成。因此，性能还关乎转化率。

于是，新的方案出现了，就是类似WEEX的跨平台技术。业务方想要的这四点，都给你。WEEX 不仅可以使用 H5 的开发体验，提升研发效率，还能充分释放 Native 的能力，产品性能和体验可以和Native 媲美。

WEEX介绍

2016年 WEEX开源，我们社区有142位的开发者在贡献，其中1／3来自是社区同学，非阿里同学。WEEX 是Apache顶级开源项目，目前有2.4万的开发者关注。

上方这张图的左边，绿色的表示增加的代码，红色的表示删除的代码。一个好的软件，不是一味的增加代码，而是有增有减。为什么呢？因为，好的项目必定经历了优化和重构的过程。WEEX也是如此，我们不仅在做一些功能迭代，还在提升性能，比如 Native list。

感谢社区同学们的信任，众多APP运行在WEEX上。不仅国内的用户在使用，国外的开发者也在使用。同时，我们可以看到腾讯的企鹅电竞、全民竞猜、网易考拉、盛大游戏、分期乐等等都在使用。

WEEX出生于淘宝，出生于电商，但是不止于电商。而这些 APP包含了多个行业和领域，涉及到了电商、金融、工具、游戏、新零售等。各行业都在使用新的研发模式在迭代自己的业务。这里再次感谢社区的开发者对WEEX的贡献。我们来看一组数据。

这是WEEX CONF企鹅电竞的数据。这里，我选取了腾讯使用WEEX的数据。目前腾讯的企业电竞和全民竞猜都在使用WEEX。WEEX给他们带来的好处是显而易见的。开发效率提升了40%，内存降低了45%，帧率提升了15%，页面打开耗时降低了44.9% 。内存、帧率、耗时都是跟产品体验息息相关。

二维码大家会后可以扫一下，是他们WEEX文章的分享。记得当时他们前端Leader说，在腾讯内部写了几篇WEEX文章都上内网技术论坛头条了，很多人关注他们。

我们再来看一个数据。极客时间，极客邦做的类似于逻辑思维的一个产品，不过是面向技术的。他们的App功能也不少。这款App是他们从0-1，完全 WEEX 开发的一款App。其中，Android 1.5人力40天上线。

我们再来看看阿里巴巴WEEX的使用情况。2015年，WEEX没有开源之前，我们在双11的会场框架和狂欢城开始使用WEEX。2016年，WEEX全面铺开，从双11的预售到双11结束，全程使用WEEX。近2000个页面，秒开率接近96%，其中WEEX页面数占99%。到了2017年，几乎所有的 APP全部采用了WEEX，WEEX已经成为了阿里巴巴的主流框架和研发模式。

WEEX 不仅在活动页、运营营销页上使用，也开始在频道页使用，比如有好货。同时也支持业务创新。比如3D、AR的支持，包括复杂动画、富交互的实现。最近，我们还开源了bindingx。

从社区到阿里巴巴，我们都一直在探索高效开发之路。既要满足效率提升，又要体验提升，给WEEX的框架带来了契机。

EMAS-跨平台产品介绍

经过几年的发展，跨平台开发模式已经成为了标准的研发模式。

去年拜访了一家证券公司，一位老总的话，我记忆犹新。原话的意思大概是这样的，“移动互联网的下半场，我们很紧张，一切都在围绕着效率、围绕着产品。但是，我们没有能力把这一套基础设施建好。即使可以建设，但是也许赶不上下半场。有的选比没得选要好的多”。

EMAS-跨平台解决方案就是提供一张船票，开往移动互联网下半场的船票，我们把移动APP研发的基础设施建好。帮助企业提高研发效率，提升产品体验。

我们的产品主要分为5个部分，覆盖了从研发 到调试 到测试 到发布 到运维运营整个环节。具体表现了：

专家服务，主要提供咨询服务，帮助企业梳理业务架构；
开发者工具和商业组件，帮助开发者进行研发阶段的效能提升；
云端控制台，通过流程管控，确保产品上线质量；

以及泛质量管理平台，可以度量业务，业务做的如何，如何发现APP的问题并解决问题。

我们来看第一个产品：开发者工具。

这是我们开发者工具的功能图。我们可以使用IDE创建项目、构建、调试和预览项目。

Native的开发者应该深有感触，调试链路打通十分重要。尤其是H5容器的调试，链路太长。而我们的IDE提供了真机调试、模拟器预览等功能。同时，为了满足一些开发者的个性化需求，我们提供类似VSCODE的IDE配置文件。开发者可以设置字体大小、背景颜色等。我们也关注开发体验，提供了代码补全、组件提示的功能。甚至，有一些开发者比较极客。我们内嵌了命令行输入的功能。因此，整个开发环境是闭环的，是一站式的，开发者专心业务开发就好。

为了提高开发的效率，我们还提供了丰富的组件。WEEX开源SDK本身是内嵌了一些组件，同时也有一些开源的UI层面组件。但是，那只是冰山一脚，如图所示，我们提供了丰富的商业组件。不仅扩展了硬件能力，比如震动；还增加了业务属性组件，比如分享，比如摇一摇。同时，很多企业有图表的诉求，所以我们提供了完整的图表组件。

这个图表组件是Native开发的，上面封装了一层WEEX的语法。社区里，基本上看不到类似的组件，很多都是H5版本的。大家也知道，H5的图表节点很多，webview容器渲染起来就比较耗时，经常卡顿。做过这方面业务开发的同学，应该感受过H5图表的体验不友好。

而这款图表组件经历了阿里巴巴业务洗礼，性能卓越。

同时，我们提供了服务组件，比如图像识别、OCR组件，可以识别身份证、银行卡。在金融场景下用的比较多。做OCR算法的这个团队，有个很诗意的名字叫图像和美。目前OCR识别率业内遥遥领先。

很多时候，都在提技术驱动业务。如何驱动？

首先，我们得把技术准备好，业务才能发展吧，否则就是业务倒逼技术了。比如短视频的出现和火爆，其中一个因素是4G的诞生，3G情况下，这个玩不转的。同样，EMAS把APP端上的能力充分释放出来，是为了业务更好的发展。

大家可以扫一扫，下载这款APP：EMAS组件市场，体验下我们部分组件能力。

我们不仅提供了研发阶段的支撑，我们还提供了devops研发流程的保障。主要包括4块功能：业务管理、代码构建、项目发布和监控运维。

比如，我们有一个业务线叫海淘，海淘下面有美妆、奶粉、箱包等几个业务模块。我们的开发同学可以创建一个业务包括，上传编译构建完成的代码，进行代码测试，如果没有通过代码检查，有问题需要修复，修复完成后，发布页面。

在发布的时候，我们可以灰度发布，也可以使用预加载能力。发布完成，我们可以看到页面的一些数据，比如JS ERROR 秒开率等等。问题严重，我们可以修复，再次发布。

这是云端控制台的界面。这里提一下秒开率。我们控制台在发布的时候提供了预加载能力。我们可以提前将业务的JS bundle下发到APP。以前，我们做性能优化，很多时候都在优化代码，重构代码，但是我们不能忽略网络。网络耗时也影响很大。预加载提供了预置能力，可以直接从本地加载页面。

前面一直在提产品体验的重要性。我们也在尝试一种新的思考方式，用产品体验视角来追溯和定义性能维度。WEEX高可用提供基础分析、监控告警、活动大盘、深度分析4大模块。

到目前为止，基本介绍了跨平台产品的整体结构。

跨平台产品其实整个是完全的闭环，无论是已有APP，新业务采用WEEX开发还是从0-1完全采用WEEX开发。平台既可以解耦，又可以流程衔接。跨平台解决方案带来并不只是效率和体验的提升，其实本质上是研发模式的升级。

我们一款APP既可以包含WEEX容器、也可以包含H5容器。而WEEX可以做到多条业务并行开发，多团队分布式协作。

底层的通用能力WEEX提供好。WEEX开发同学可以专注业务开发。iOS/Android同学可以把技术做深，保障App性能稳定性，也可以做组件扩展，也可以做WEEX业务开发。

2011年到2016年，是H5容器时代。2016年之后，就端上容器和前端融合时代。一切都围绕效率和体验升级。而跨平台解决方案可以助力每一位WEEX开发成为业务特种兵。

原文发布时间为：2018-05-3

本文作者：鬼谣

本文来自云栖社区合作伙伴“淘宝技术”，了解相关信息可以关注“淘宝技术”。