《原生技术&内核 - 4 - 清锐_瑜晟 -淘系交易终端架构探索与实践.pdf》由会员分享,可在线阅读,更多相关《原生技术&内核 - 4 - 清锐_瑜晟 -淘系交易终端架构探索与实践.pdf(28页珍藏版)》请在三个皮匠报告上搜索。
1、清锐:淘交易前端 瑜晟:淘交易客户端淘系交易终端混合架构 探索与实践录 01 背景 02 标 03 屏性能优化 04 帧率&内存优化 05 总结与展望背景基础交易链路是什么?一条流程链路,流程、节点驱动立足两个核心场景,选到支,支到用购物确认订单付成功订单列表订单详情退款详情极简下单背景业务的特点?成交决策优惠凑单创新型交互产品试错成本核:性能体验核:业务迭代效率打开快滑动阻塞屏性能滑动帧率近 3 年上半财年,同期需求量对202120222023想发就发电商核链路,交易功能属性强背景终端技术侧这些年的变化购物下单订单列表订单详情物流极简下单退款NativeNativeNativeNativeN
2、ative-Native购物下单订单列表订单详情物流极简下单退款Native+Web/WeexNative+WebNativeNative+WeexNativeNative+WeexWeb20132023从纯原开发逐步过渡到多跨端模式,终端技术侧为什么发这种变化?背景客户端遇到的问题?1.挑战:发版效率问题开启 集成BugFix 集成灰 发布灰 发布版本 提审正式版本 放量成为主 版本集成等待时间周期,平均 2 周,特殊情况 2周,甚版可发 业务需求交付周期,旦错过集成点,需要等待2周左右2.挑战:开发效率问题3.挑战三:多端致性问题4.挑战四:尾碎化问题需求 提出开发 完成安卓iOS鸿蒙最版
3、本活跃占70%左右活跃设备数于1000的版本200+安卓iOS活跃设备数于1000的版本近 100最版本活跃占70%左右业务需求新版本验证只能覆盖70%左右户流量,30%庞户体验有损 众多的碎化版本导致在稳定性、兼容性等临极挑战个需求开发多遍,投资源翻倍 多端协同合作成本 双端因为代码不致带来稳定性险渲染逻辑业务逻辑UI动态性,所有UI交互相关变更均依赖客户端发版 缺乏通的UI组件复 在跨平台兼容性、布局复杂性等临挑战缺乏能的复性,能变更均需要发版 缺乏逻辑的动态编排能 传统研发模式,业务逻辑耦合严重,可维护性差2周背景客户端侧架构这些年做的升级?组件化 协议DinamicX 升级新奥创 升级
4、原能 事件链旧石器时代新石器时代铁器时代冷兵器时代热兵器时代端侧在动态化渲染和能上做到了“极致”,是否满当前业务的诉求?20152017201820201.纯原开发 2.级维护,不存在 能复 3.动态性1.纯原开发,模块化 和解耦 2.部分UI组件可以复 3.动态性1.组件渲染具备动态性 2.部分双端渲染致性 3.不满W3C标准 4.复杂交互法持 5.业务逻辑不持动态1.部分端侧业务逻辑后 移新奥创配置平台 2.部分标准化事件执 逻辑持动态化配置1.业务逻辑能进步 标准化和原化 2.持动态配置和下发背景新环境下依然临的严峻考验?能力抽象端侧能力编排云端+XMLJSON原子能力视图widget逻
5、辑表达式1.产品形态相对稳定2.交互模式可枚举1.产品形态变更频繁,尤其是创新型交互2.任务重、时间短学习成本表达有限程结构固化能上限低能补充依赖发版能发现使成本最终选型前端案:1个上线极简下单 为例300+时评估Native 案:前端案:近100背景前端案的探索Native 容器+WebNative 容器+Weex 1Native 容器+Weex 2渲染引擎架构绘 UI+W3C 全集Native UI+W3C 集绘 UI+W3C 集渲染引擎可控性低较体验上限?=Native研发效率较低较混合架构标性能体验=Native,研发效率=Web2.滑动帧率:满帧,60FPS1.屏性能:瞬开,350m
6、s3.迭代效率:想发就发,7x24 时可发布Native 业务容器 +Weex2 渲染框架优化屏性能&滑动帧率屏性能现状分析从点击到渲染完成,屏性能问题卡点在哪?导航动画业务请求&渲染容器阶段初始化资源加载从个对视频开始问题分析容器初始化阶段思考容器的初始化是否可以提前初始化掉?JS资源加载阶段业务请求阶段业务渲染阶段思考资源缓存了么?缓存的命中率是否可以更些?思考是否能最早时机的发起业务请求?思考上些固定已知的元素是否可以提前作渲染准备?络资源预取引擎渲染屏性能优化策略机制1.交易业务多,贯穿购中、购后等全链路2.交易是条流程链路,动线清晰交易链路 特点订单详情付成功订单列表确认下单极简下单