常见的建议是保持状态最小化并使用memoized选择器(如重选lib)来获取派生数据.我知道有些情况下将它放入商店是合适的.我的应用程序中有很多派生数据,生成起来有些昂贵,但由于其使用方式的性质,没有必要经常生成它.在什么时候数据太复杂,不适合选择器,应该放入商店?
更多细节:
我有时间序列数据,我运行一些计算来生成数据的派生"视图".每个视图中的记录都是根据之前的所有记录计算得出的.
提供一个更具体,有点人为的例子:
目前我在没有redux的indexedDB中做这一切.
我有一个主表纯粹是用户输入:
type Earnings = {
id: number;
time: Date;
amount: number;
category: 'A' | 'B' | 'C' | 'D';
};
Run Code Online (Sandbox Code Playgroud)
我有一堆钩子,当Earnings数据发生变化时会生成"视图"表.
type EarningsByDay = {
id: number;
date: Date; // only used to date part
amountTotal: number;
maxToDate: number;
};
type EarningsByDateAndCategory = {
id: number;
date: Date; // only used to date part
category: 'A' | 'B' | 'C' | 'D';
amountTotal: number;
maxToDate: number;
};
Run Code Online (Sandbox Code Playgroud)
在上面的视图中,通过从小于当前项的日期的所有记录中查找最大值来计算maxToDatefor .同样地.EarningsByDayamountTotalEarningsByDaydateEarningsByDateAndCategory
如果用户过去编辑/删除/插入收入,则需要重新生成之后的所有派生数据.然而,这种情况很少见,并且大多数时候用户将按Earnings时间顺序添加记录(这意味着我所要做的就是搜索过去的记录以找到最大值).
作为我计划迁移到redux的一部分,我计划只将Earnings记录存储在indexedDB中,并在启动时将它们全部加载到商店中(一年数据约为5,000条记录).然后我会使用选择器来导出"视图".
我担心的是,这太重了,不适合选择者.另外,重新选择memoizes的方式,我最终会在追加记录时重新生成所有派生数据.
我一直在使用问题中描述的重新选择,到目前为止还没有遇到任何问题。最大的缺点是状态的形状主要由一个主选择器而不是存储中的内容定义,这使得调试工具不太有用。然而,我发现这是调试工具的限制,而不是如上所述使用选择器的限制。调试时最好有一个选择器的树视图。我同意这种权衡,因为代码最终变得更简单、更容易理解并且更容易测试。
更新:看起来正在进行一些工作来使调试选择器更容易: https: //github.com/reactjs/reselect/issues/279
| 归档时间: |
|
| 查看次数: |
226 次 |
| 最近记录: |