Adapter 也是对局部的展示和功能的封装。它为 ListView 高性能场景而生，它是 Component 实现上的一种变化。

• 它的目标是解决 Component 模型在 flutter-ListView 的场景下的 3 个问题
• 1）将一个"Big-Cell"放在 Component 里，无法享受 ListView 代码的性能优化。
• 2）Component 无法区分 appear|disappear 和 init|dispose 。
• 3）Effect 的生命周期和 View 的耦合，在 ListView 的场景下不符合直观的预期。

概括的讲，我们想要一个逻辑上的 ScrollView，性能上的 ListView ，这样的一种局部展示和功能封装的抽象。
做出这样独立一层的抽象是，
我们看实际的效果， 我们对页面不使用框架，使用框架 Component，使用框架 Component+Adapter 的性能基线对比

• Reducer is long-lived, Effect is medium-lived, View is short-lived.
• 我们通过不断的测试做对比，以某 android 机为例：
• 使用框架前 我们的详情页面的 FPS，基线在 52FPS。
• 使用框架， 仅使用 Component 抽象下，FPS 下降到 40， 遭遇“Big-Cell”的陷阱。
• 使用框架，同时使用 Adapter 抽象后，FPS 提升到 53，回到基线以上，有小幅度的提升。

Directory

推荐的目录结构会是这样

sample_page
-- action.dart
-- page.dart
-- view.dart
-- effect.dart
-- reducer.dart
-- state.dart
components
sample_component
-- action.dart
-- component.dart
-- view.dart
-- effect.dart
-- reducer.dart
-- state.dart

上层负责组装，下层负责实现, 同时会有一个插件提供， 便于我们快速填写。

以闲鱼的详情场景为例的组装：

组件和组件之间，组件和容器之间都完全的独立。

Communication Mechanism

• 组件|适配器内通信
• 组件|适配器间内通信

![image.png](https://img.alicdn.com/tfs/TB1GrISCkzoK1RjSZFlXXai4VXa-1846-986.png)
简单的描述：采用的是带有一段优先处理的广播， self-first-broadcast。
发出的 Action，自己优先处理，否则广播给其他组件和 Redux 处理。
最终我们通过一个简单而直观的 dispatch 完成了组件内，组件间（父到子，子到父，兄弟间等）的所有的通信诉求。

Refresh Mechanism

数据刷新

• 局部数据修改，自动层层触发上层数据的浅拷贝，对上层业务代码是透明的。
• 层层的数据的拷贝
• 一方面是对 Redux 数据修改的严格的 follow。
• 另一方面也是对数据驱动展示的严格的 follow。

![image.png](https://img.alicdn.com/tfs/TB1BjQLCkvoK1RjSZFNXXcxMVXa-1714-828.png)

视图刷新

• 扁平化通知到所有组件，组件通过 shouldUpdate 确定自己是否需要刷新

![image.png](https://img.alicdn.com/tfs/TB1PkgHCbPpK1RjSZFFXXa5PpXa-1380-620.png)

优点

数据的集中管理

• 通过 Redux 做集中化的可观察的数据管理。我们将原汁原味地保留所有的 Redux 的优势，同时在 Reducer 的合并上，变成由框架代理自动完成，大大简化了使用 Redux 的繁琐度。

组件的分治管理

• 组件既是对视图的分治，也是对数据的分治。通过逐层分治，我们将复杂的页面和数据切分为相互独立的小模块。这将利于团队内的协作开发。

View、Reducer、Effect 隔离

• 将组件拆分成三个无状态的互不依赖的函数。因为是无状态的函数，它更易于编写、调试、测试、维护。同时它带来了更多的组合、复用和创新的可能。

声明式配置组装

• 组件、适配器通过自由的声明式配置组装来完成。包括它的 View、Reducer、Effect 以及它所依赖的子项。

良好的扩展性

• 核心框架保持自己的核心的三层关注点，不做核心关注点以外的事情，同时对上层保持了灵活的扩展性。
• 框架甚至没有任何的一行的打印的代码，但我们可通过标准的 Middleware 来观察到数据的流动，组件的变化。
• 在框架的核心三层外，也可以通过 dart 的语言特性 为 Component 或者 Adapter 添加 mixin，来灵活的组合式地增强他们的上层使用上的定制和能力。
• 框架和其他中间件的打通，诸如自动曝光、高可用等，各中间件和框架之间都是透明的，由上层自由组装。

精小、简单、完备

• 它非常小，仅仅包含 1000 多行代码。
• 它使用简单，完成几个小的函数，完成组装，即可运行。
• 它是完备的。

Fish Redux 目前已在阿里巴巴闲鱼技术团队内多场景，深入应用。

（编辑：衡阳站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!