我应该在域之后还是在应用程序查看之后构建Redux存储？

Question

我正试图绕过Redux以及如何在React Native应用程序中实现它.

我得到了一般的想法,我喜欢它.但我不太确定如何构建我的商店.我将尝试用应用程序中的两个场景给出一个示例.

ProjectListScreen:使用ListView组件构建的项目列表.每行显示每个项目对象的大约5个字段.

ProjectScreen:显示特定项目的所有字段的ScrollView.项目对象可能非常大而且不完全平坦.例如,它包含一个指向图像的UUID数组.

那么,我应该有一个减速器来处理完整的"项目",还是应该有一个用于ProjectList的减速器和一个用于项目的减速器？即我应该考虑真实的域名或应用程序中的视图/屏幕？

我怀疑答案是模仿域名.但如果列表中有1000个项目怎么办？我需要将1000个项目加载到商店中,包括每个项目的所有字段.但我只需要其中五个字段来呈现ListView.由于用户无法在ProjectScreen中打开所有1000个项目,因此可能只会完全加载几个项目.一个项目的更改将强制while数组的副本,以保持不可变.

我不想陷入过早的优化,但我想从一开始就让商店的结构有点正确.我知道我可以使用Immutable.js来优化列表中项目的更新,但这会让我使用非JS对象,这感觉有点麻烦.

我宁愿使用无缝不可变,但我不认为SI的大型列表的这种部分更新会比复制列表更快.

我很想听到与UI渲染和其他任务相比,性能不会成为问题.这将使得与域结构一起使用变得简单.

Answer 1

领域,绝对.您的商店结构应该完全反映您正在使用的实际数据.然后,您的UI层应该在每个组件的基础上进行任何转换,主要是在您的mapStateToProps函数中.专注于构成应用程序核心的操作和行为.(这也应该导致更好的测试设置.)

组织嵌套或关系数据的最佳实践是对其进行规范化,类似于数据库中的表.我已经写了一些先前的答案,在某种程度上描述了这个概念,并链接到一些进一步的文章和讨论([0],[1],[2]).

我一般建议不要使用Immutable.js,至少要先开始.它有其用途,如果您的应用程序配置正确,可以提供一些性能改进,但也有许多潜在的性能陷阱([3]).我建议坚持使用普通的JS对象.有多种方法可以以不变的方式使用它们.我有一个描述这些方法的文章列表([4]),以及一个可以更容易地不可变地使用普通JS对象的库列表([5]).

最后,我实际上刚刚开始研究Redux文档的新页面,该页面描述了构造reducers的最佳实践.它需要一些时间来编写和打磨,但你可能想要留意它.问题出在[6],并且链接到我当前的WIP文章分支.

[0] /sf/answers/2667362771/
[1] /sf/answers/2661205921/
[2] /sf/answers/2659803471/
[3 ] https://github.com/markerikson/react-redux-links/blob/master/react-performance.md#immutable-data
[4] https://github.com/markerikson/react-redux-links/blob /master/immutable-data.md
[5] https://github.com/markerikson/redux-ecosystem-links/blob/master/immutable-data.md
[6] https://github.com/reactjs/redux /问题/ 1784

编辑:

作为后续工作,Redux文档现在包含一个"Structuring Reducers"部分,其中包含有关此主题的各种信息.