A3--臧成威--京东双十一实战验证.pdf

1、京东双实战验证臧成威 京东零售，动态化架构师TaroNative 实现套代码多端极致体验臧成威京东零售，动态化架构师拥有15年的软件业经验，曾在美团、淘宝、京东等多家顶尖电商互联公司深耕动态化技术，对代码始终保持着热情与执着。在美团期间，主导了组件化建设及持续构建系统 Hyperloop 的开发，极地提升了开发效率和系统稳定性。在阿期间，参与了绘制的新代动态化案 Weex2 的研发。通过优化渲染引擎，使得应能够在不同设备上保持致且快速的表现，同时幅降低了开发和维护成本。在京东，担任研动态化框架 Taro Native 的主架构师，主持设计了 iOS、Android、鸿蒙、Web 多端统的跨端动

2、态化框架。录CONTENTS010203Taro Native 动态化技术的背景Taro Native 核技术实现Taro Native 未来展望PART 1Taro Native 动态化技术的背景动态化的六边形战士京东电商动态化的核诉求稳定性性能开发效率亿级 PV 业务下，极高稳定性的基本诉求贴近原生的性能要求亿级日活带来的需求，依赖更高的开发效率功能随着业务复杂度增高，功能性需求也不断提高跨端适配iOS、Android、鸿蒙、微信小程序、H5多端适配也成为了问题触达效率端交叉模块化的功能使得触达成为更为复杂的问题京东电商动态化的核诉求动态化的六边形战士稳定性性能功能触达效率开发效率跨端适配

3、问题的解法稳定性性能开发效率功能跨端适配触达效率尽可能多的复用代码表现层的代码一致（避免判断）框架层的代码一致（使用跨端语言）内核 Core（C+）Android 容器 SDKiOS 容器 SDK鸿蒙 容器 SDKH5 容器 SDK程序 容器 SDK统的业务 DSL问题的解法稳定性性能开发效率功能跨端适配触达效率技术优化手段异步流水线表达式引擎双引擎零拷贝预编译优化高度裁切全链路异常捕捉机制文字大小计算缓存组件复用池任务队列漂移UI 操作指令打散首屏帧同刷机制异常报警机制全链路性能追踪JoyJS 引擎No Runtime码表压缩问题的解法稳定性性能开发效率功能跨端适配触达效率将整页面进行分块发

4、布楼层化通过楼层化，达到了如下效果：页面进行模块化分离，每个模块可以单独打包部署 楼层数据与楼层模板进行分离，楼层模版得以复用 多种楼层模版架构可以进行混合，页面演进可以进行渐进式升级 页面 AB 实验 解决了更快触达的问题问题的解法稳定性性能开发效率功能跨端适配触达效率选择合适的 DSLDSL 的核心诉求：满足京东的楼层化的业务形态 易于学习 拥抱 W3C 标准 支持复杂的定制能力选择一个常见的前端 DSL类 Vue vs 类 React项类 Vue类 React性能优化段易学程度灵活性语法便捷性可视化程度问题的解法稳定性性能开发效率功能跨端适配触达效率选择合适的 DSLDSL 的核心诉求：

5、满足京东的楼层化的业务形态 易于学习 拥抱 W3C 标准 支持复杂的定制能力 告 .mod flex-direction:column;width:100%;height:100%;padding-left:10px;padding-right:10px;border-radius:0;.function main(data)var data=$data;data.viewWidth=$env.screenWidth-16*2;return data;function main()console.log(告点击)import deepClone,isEmptyObj from./utils.t

6、s;function defineCard()TN.defineCard(/如果需要复杂的数据处理，那么就在 script 段来写数据预处理的逻辑 dataProcessor(originalData)var data=originalData;data.viewWidth=$env.screenWidth-16*2;data.isShowPop=false;return data;,data(),/以下TN楼层的命周期 /在模版刚刚被创建时执 created(),/在模版视图添加到视图树上时触发 attached(),/在视图层布局完成后执 ready(),/模版视图被移除时执 detach