“Fish-Redux复杂场景的落地与演进”

1 .Flutter fish redux 2.0 演进 闲⻥-啊丘 2021.7.8 

2 .Flutter ： 1. Design beautiful apps 2. Productively build apps 3. Create faster apps get mobile, web, & desktop app learn 

3 .Flutter 如何绘制 Flutter 则采⽤了声明式编程模式，框架隐藏了具体的构建过程，开发者只需要声明状态，框架会⾃动构建⽤户界⾯。 这也就意味着 Flutter 构建的⽤户界⾯就是当前的状态。 相⽐较原声开发的⼀些区别： iOS 和 Android 的原⽣开发模式是命令式编程模式。命令式编程要求开发者⼀步步描述整个构建过程，从⽽引导程序 去构建⽤户界⾯。 绘制代码demo 

4 .Flutter 状态管理 复杂⻚⾯开发有效的状态管理： 1. 通信问题 2. 组件之间的相互依赖 3. 界⾯刷新控制 深层次界⾯demo绘制 

5 .Flutter 提供的解决⽅案 状态更新： Notification InheritedWidget 解决了部分Flutter侧通信的问题 组件之间的复⽤ 部件刷新控制 数据分治，逻辑分治等都没有很好的解决 Flutter 解决⽅案demo 

6 .Fish redux： 介绍： Fish Redux是⼀个基于 Redux 数据管理的组装式 flutter 应⽤框架， 特别适⽤于构建中⼤型的复杂应⽤，它最 显著的特征是 函数式的编程模型、可预测的状态管理、可插拔的组件体系、最佳的性能表现。 Component： 组件是对局部的展示和功能的封装。 组件是对视图的分治，也是对数据的分治。 Effect： Effect 是对⾮修改数据⾏为的标准定义，它是⼀个函数签名: (Context, Action) => Object Reducer： Reducer 是⼀个完全符合 Redux 规范的函数签名:(T,Action) => T，组件是对局部的展示和功能的封装。 

7 .Fish redux 有效的状态管理 复杂⻚⾯开发有效的状态管理： 1. 数据的集中管理 2. 消息传递，View、Reducer、Effect 隔离 3. 组件的分治管理 4. 声明式配置组装 5. 良好的扩展性 Fish redux demo 

8 .Fish redux 2.0： 然⽽随着⻚⾯复杂度的不断提升，现有能⼒已⽆法⽀撑新业务场景的述求。特别是对 - ⻚⾯编排 - 动态AB - 灵活性不⾜ 于是我们基于Fish-Redux现有框架做了新⼀轮架构演进。通过对现有适配器能⼒的升级，进⼀步提⾼了架构的灵活性。Fish-Redu 2.0版本正式诞⽣！ 

9 .Fish redux 2.0： 动态编排实现： FlowAdapater不再以静态的形式获取组合的Dependent列表，由静态参数 List 转变为 FlowDependencies 获取的动态回调。 我们可以在FlowDependencies中做⼀系列扩展，例如⻚⾯展示动态编排， 组件的AB功能等等。 分治数据特性： 动态获取的List为connector+component的数据集合，不再是单⼀的做数 据映射UI的逻辑处理，将真正的数据处理过程交回到各个connector中，保 持了adapter内组件的数据处理分治特性。 fish redux 2.0 demo 

10 .Fish redux 后续 整体redux概念不变如何更加精简 针对不同容器能⼒如何⽅便实现 贴合开发者使⽤ 谢谢！ 

11 .欢迎⼤家跟我们持续交流