开场:两年前刚刚开始接手火掌柜的时候,作为的面向商家的APP,有非常多的设置页面,但是每个页面的设置控件又逃不出那么几个类型。就在想是否可以通过一些配置下发给客户端,告诉我们这些页面具体要展示哪些控件,保存要调用什么接口,和一些相关的跳转页面。 那么客户就可以关注基础组件的开发,从业务中抽出来,做一些平台化的事情。
当时这个想法也跟一些同事提起过。现在看来当时是有点愣头青了。因为我们花了两年时间才能做这次分享,虽然我们现在还是有很多问题要去解决。两年中我们通过一次一次的整个App的架构改造才有了动态化的基础。
按照石胆的话说这都叫做”还债“
然后在去年四月份,掌柜首页迎来了一次重大的改版。当时跟大米决定趁着这次首页改造先把首页动态化做了。万幸的是当时把这件事情做掉了。随后的天气、广告、功能大全都是通过这个架构实现的。
今天聊的动态化更加侧重于内部列表、设置表单页面的动态化。由于跟首页的场景区别比较大,所以我们通过两个方案提供,但是整体的思路还是一样的。
为什么叫香港记者呢。传说中“香港记者”跑的最快。所以我们希望随着动态化的完善。我们的业务可以跟香港记者跑的一样快.
我们的动态化方案稳定,并且基础组件库丰富后,产品的同学在设计App的时候就可以通过后台拖拽的方式生成出需要的页面。并且可以在app上可以展示(后面的演示可以看到)
我们乐观的认为我们的系统确实能够带来开发效率上面的提升,那么产品就愿意通过我们的平台来创建新的页面。换句话说组件都是通过根据交互规范开发的标准组件库出来的。那么app的交互应该是统一的。 这会带来另一个好处是,以后app整理风格的改变会变得很容易。
理所当然的,因为页面元素和动作都是下发的,没有新的组件就不需要客户端参与开发了。
cover掉80%的需求当然只是我的乐观估计。这个要看我们的组件库能丰富到什么程度。
因为能颗粒度细到每一个组件。所以这个也不是问题。
实现方式
数据和布局接口分离: 这个也是当时我们比较纠结的一个问题。
统一端上的页面路由: android、iOS页面的URL统一
表达是支持: 掌柜不少组件有联动效果,比如关闭一个开关这个页面相应的其他几个元素会隐藏。
多级缓存:页面,页面间参数传递,app生命周期的全局,文件。表达式可以获取不同缓存中的变量(演示中有)
更新策略:展开有点复杂,我们整理一片文章出来
完善的开发流程:开发、测试、预发、上线的环境隔离。用户操作权限和日志记录。
为什么是这个方案
毕竟我们团队都是开发iOS、android的转前端成本比较高
毕竟是一个表单操作为主的app,网页要体验做上去和不同android系统适配估计投入的人力不比两端开发少
在做这套系统之前,我们已经对现有的不同组件建立了数据模型,日常开发中搭建页面就是在为不同的页面配不同的数据模型。所以在我们看来就差下发json转成模型这一步了
页面间跳转我们也做了一个中间的路由层
@虾米
TODO
for
语句支持之前项目都在探索,现在核心已经成型。后面会立项圈资源来做。