申请试用
HOT
登录
注册
 
“Fish-Redux复杂场景的落地与演进”
0 点赞
0 收藏
7下载
MobTech
/
发布于
/
50
人观看

针对Flutter复杂页面架构的思考,闲鱼提出了数据管理的组装式Flutter应用框架Fish-Redux,Fish-Redux在页面组装,组件通信等方面具有强大的表现能力,自开源以来也对编排做了优化演进。本次分享来聊下Fish-Redux复杂场景的落地与演进

啊丘.png

展开查看详情

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.欢迎⼤家跟我们持续交流

0 点赞
0 收藏
7下载