闲鱼研发框架应用和探索

1. 闲⻥鱼研发框架应用用和探索讲师：梁梁治峰(花名：玄玄川)

2. 自自我介绍梁梁治峰(玄玄川) 阿里里里巴巴 – 闲⻥鱼 –无无线技术专家现任阿里里里巴巴闲⻥鱼买家链路路客户端负责人人,负责闲⻥鱼客户端主链路路架构升级，主导闲⻥鱼flutter化的落地和研发框架演进。

3. • 闲⻥鱼Flutter 研发框架使用用现状 • Flutter 研发框架下一一体化模式 • Flutter 研发框架下动态能力力力 • Flutter 研发框架下互动能力力力 • 后续规划和展望

4. 闲⻥鱼Flutter研发框架使用用现状 FishRedux 重逻辑一一体化重界面面动态模版重特效互动引擎

5. Flutter 研发框架下一一体化模式

6. 一一体化模式 Android Client Service DoMain iOS H5 UI 逻辑协作

7. 一一体化模式状态展示状态逻辑逻辑领域 Action 展示逻辑领域 (Action) => Action 副作用用副作用用传统新型 Client Server FaaS

8. 一一体化模式 Client Flutter UI State LogicEngine Loacl Logic Protocol Diﬀ Nexus Nexus 是一一套一一体化C/S 协议解决逻辑归一一问题面面向接口口 Nexus Protocol 类型安全高高性能 Action Action|State|diﬀ 高高于API 业务逻辑 VM服务 Saker 日日志/监控限流/熔断应用用服务 FaaS 容器器应用用基础服务平台相关性 Dart For FaaS Gaia 通信协议 BaaS HSF 中间件逻辑内聚

9. 一一体化模式状态复杂状态变化多云端交互多 UseGuarantee Action ChangeAddress Action UserRedPacket Action Init Action CretaOrder Action 云端模型统一一屏蔽协议逻辑归一一代码量量减少业务闭环

10. Flutter 研发框架下动态能力力力

11. 动态性逻辑动态性电商业务具有强运营强时效性特性 UI动态性

12. 动态模版 DX平台编辑模版组件渲染编译生生成二二进制文文件数据解析绑定事件/表达式注册动态模板化是集团内较为成熟的一一套基于Native技术的模板化方方案，专注于 UI 模板渲染生生成模板下载链接模板下载解压

13. 核心心问题-Layout UI = Decoration + Layout + Content Flutter 约束特点 RenderBox RenderSliver 共性 Min Max Flex Row Stack 动态模版 SliverGrid 特性 match parent wrap content • 尽可能大大的约束 • 跟随内容大大小小的约束描述上样式和布局彻底分离量量行行行描述感性描述

14. 布局表达最大大值估算实际值

15. 业务效果

16. 性能参考 FPS平均值在55以上

17. 性能下一一步探索 FPS 55 60 高高级控件特性 Flutter 原生生 DX

18. Flutter 研发框架下互动能力力力

19. 背景和现状 ๏ UI 与游戏引擎的边界单边 UI 不不互通 Canvas 传统游戏引擎 Flutter App Skia ๏用用游戏化的方方式创造更更有表现力力力的交互体验，创造新的业务玩法和价值

20. 核心心问题-融合应用用 Flame GameObject GameObjectWidget GameObjectElement GameObjectRenderObject UI Game RenderObject GameObject->RenderObject • 游戏系统不完善 • 缺少局部刷新支持 • 缺少GUI系统 • 动画支持格式少 Paint Layout HitTest

21. Candy 整体设计 GameObject GameObjectWidget GameObjectElement GameObjectRenderObject ๏ 架构设计：按照ECS标准游戏行行行业开发者 ๏ 接又设计：对齐集团互动EVA App应用用开发者 ๏ 应用能力：融入Flutter绘制体系 UED视觉设计者 ๏ 扩展能力：游戏子系统化能力补充 Candy——符合ECS标准的与Flutter高高度融合的原生生开发高高性能互动开发引擎

22. 效果 • 按游戏模式开发逻辑 • 动画能力封装为Widget • Flutter UI无缝插入游戏场景 • 按Flutter模式开发逻辑 • 游戏最终以Widget形式插入Flutter页面 • 动画Widget无缝插入

23. 效果-⻣骨骼 DragonBones

24. 效果-调试

25. 性能参考

26. 后续规划和展望

27. 互动编排 = Candy Nexus SSR 布局绘制 Dart = DX 云端一一体化研发 Flutter + Serverless Fass

28. 【淘系技术】微信公众号扫码获取本期ppt内容及回放【闲⻥鱼技术】微信公众号加入入我们