WeexConf 2018干货系列|Weex + Ui

本文是2018年 Weex Conf 中议题《Weex + Ui》的内容文档整理,主要给大家介绍飞猪 Weex 技术体系从无到有的过程,包括 Weex Ui 组件库的开发和发展,重点分享在 Weex Ui 层建设的一些经验。

文章较长,首先放上 Weex Ui 的开源地址,欢迎大家提PR,同时也可以通过 Star 来表示你的喜欢。(https://github.com/alibaba/weex-ui)

Why Weex ?

Weex vs H5

我们为什么选择Weex作为我们首要的跨端开发技术呢?

写过H5的同学肯定会被它的简单高效发布即更新一条URL可适配多端等这些所吸引,但写过 Native 的同学肯定也会被 Native 的富交互性能体验可调用原生能力可管理内存等特性给我们的业务带来更好的体验。

快和体验想同时兼得

飞猪前几年也一直在这个方向上面探索。

包括最开始的 Hybrid 开发,通过 Bridge 提供部分 Native 能⼒来提升 H5 体验,譬如我们在H5里面可以直接获取App的定位信息、使用相机、播放视频、导航跳转等能力,业界也有Cordova、Ionic、Meteor这些成熟的方案。

WeexConf 2018干货系列|Weex + Ui

还有利用离线包体系通过提前将资源⽂件下载,访问时路由拦截加载本地资源,让我们的H5页面可以达到秒出、动态更新、弱网可用效果,内部有手淘Zcache、飞猪信鸽、支付宝九州这些成熟的系统。

我有几张阿里云幸运券分享给你,用券购买或者升级阿里云相应产品会有特惠惊喜哦!把想要买的产品的幸运券都领走吧!快下手,马上就要抢光了。

等到了16年左右,跨平台开发技术逐渐火起来后,一种全新的开发思路吸引这我们,也即用JS来写Native,⽤ Web 的开发体验构建⾼性能、可扩展的 Native 应⽤,同时真正获取上述所说的体验

业务对比分析

那么为什么会选择 Weex 呢?其实和飞猪业务特点很有关系,同时又可以很好解决这些痛点。

飞猪业务迭代速度快,也需要快速上线;同时很多时候景点和海外弱网使用,同时要体验良好;

其中最重要的一点是多容器接入,适配飞猪、手淘、天猫、支付宝,也即我们一次重要业务的开发需要一个iOS、一个Android同学来开发两端,同时由一个H5同学来开发兼容手淘、支付宝、UC的 Web 版本,也即一次业务发布涉及到多端同时开发、上线。

WeexConf 2018干货系列|Weex + Ui

Weex 其实很好的解决了上述的一些问题,包括在飞猪、手淘、天猫 Weex环境下完全 Native体验,同时Bundle 资源大小较 H5 小很多,加上富交互体验、长列表性能好非常适合商品列表页面和双十一场景,最重要的是真正让我们从3个人的开发减少到了1个人,其他2个人可以去做更多有意义的事情。

原文链接