WeexConf 2018干货系列|Weex技术演进

隐风   阿里巴巴技术专家

本文是2018年Weex Conf 中议题《Weex技术演进》的内容文档整理,主要给大家介绍过去一年里Weex业务规模不断扩大,业务复杂度不断上升,给Weex带来了哪些技术挑战,以及Weex在技术架构和设计上做了哪些升级来应对这些挑战。

业务规模

e6bc12ce2c7438755ba9659b4048f1c345294488

2017年,Weex的业务规模呈现了爆发式的增长,不但在比较擅长的会场业务弥补了最后1%的页面,也就是一些富交互、富视觉的页面,让店铺承接页也全部Weex化,同时更重要的是支持了很多常态化的业务和产品。

技术挑战

c0f9ceec5045000534c83bd77dc9c5e388e40e5c

业务规模的不断扩大,业务复杂度的不断上升,给Weex的技术到底带来了什么样的挑战?

  •  交互体验问题,我们在2016年做的更多的还是纯展示的活动页面,而2017年要支持的这些常态化的业务和产品,很多原来就是native的,对于动画、手势等交互体验要求比较高,一些native非常常见的交互效果,在Weex上实现起来挑战非常大。
  •  内存压力,越来越多的业务Weex化之后,用户整个点击路径都变成了Weex,举个例子,2017年的双11预售期,当我们打开手淘,点击狂欢城H5,再点店铺承接页Weex,点主会场Weex,点分会场还是Weex,然后分会场、分会场不断地逛,链路中每个页面都非常复杂,其中大部分页面是很长的列表页,包含了大量的楼层、视频、动效等复杂组件,整体内存占用非常高,这就导致整个APP的crash率上升非常明显。2017年我们升级了列表渲染架构,针对内存问题重点优化了一次。
  • 性能稳定性,如何把V8引擎升级到JSC来提升JS执行性能,如何能让JSC在独立进程运行而不影响主进程稳定性,如何解决JS上下文全局污染问题,如何替换Yoga以解决License问题而又不影响布局性能等等
  • WeexCore,如何在架构上实现跨平台和高性能,将一些通用的逻辑下沉到C++
  • 我有几张阿里云幸运券分享给你,用券购买或者升级阿里云相应产品会有特惠惊喜哦!把想要买的产品的幸运券都领走吧!快下手,马上就要抢光了。

 演进过程

c340db4d6c8e4062fcb7e8fef6dffed1ef62bd14

纵观Weex一开始诞生到现在,它的技术演进过程可以总结为从具象到抽象不断探索的过程。

  • 特殊组件期:最开始Weex亮相的时候是2015年双11,当时只支持了一个会场页面。那时候我们做了非常多的特殊组件,比如tabbar组件,倒计时就做一个countdown组件,跑马灯就做一个marquee组件。当时的Weex可以理解为是一个非常具象的框架,由一大堆特殊组件拼接而成,最后达到了动态化的目的。
  •  偏展示期:到了2016年双11,我们要支持整个双11所有会场,几千张页面,继续使用2015年的方式肯定是不行的。于是我们做了很多偏展示的基础样式,比如支持text的基础样式,div的基础样式,最基本的动画模块,存储等一些基础且细粒度的模块等,以及一个相对来说比较高性能的列表组件。
  •  富交互期:到了2017年中,我们要支持一些固定的产品,一些核心业务,偏展示又满足不了需求了,于是我们重点去打富交互,支持富文本、手势、布局动画以及一些通用的交互组件。
  • 国际化:到了11、12月时又来了一波挑战,我们要支持Lazada等国际化的APP,于是整体做了一次国际化,比如从右到左的文字排布,比如无障碍、多语言、多端差异化等。
  • 标准化:到了2018年,我们要做的是标准化,尽可能抹平跨端在组件和架构上的不一致性,遵循标准并推进标准,让Weex变得更加通用。

猜你喜欢

转载自my.oschina.net/u/3611008/blog/1620189