【问题标题】:React/Redux Large Real Time Data List PerformanceReact/Redux 大型实时数据列表性能
【发布时间】:2018-09-13 00:31:51
【问题描述】:
目前我有大量数据(500 行),有时可以在一秒钟内更新许多记录。我正在使用 firebase 的实时数据库。我正在使用 React 和 Redux,基本上每当记录发生更改时,我都会触发一个调度事件来更新我的应用程序中的状态。当有许多记录被更新时,它会变慢并且几乎使浏览器崩溃。
我已将我的性能问题缩小到尝试一次调度 200 多个操作。但由于它是 websockets/firebase,我无法分组获取这些更新。
我想知道是否有一个库可以使用,它将调度请求排队并按顺序一次更新一个状态。而不是试图一次完成所有事情。
【问题讨论】:
标签:
javascript
reactjs
redux
【解决方案1】:
这些问题是否在使用 Redux 开发工具的开发过程中也正在运行?
Redux 已针对处理大型数据集进行了相当优化(特别是当您规范化数据结构时)。但是,如果您正在调度大量操作并且在 Redux 存储中还有大量数据,那么使用 Redux 开发工具可能会给人一种性能不佳的错误印象。
在您的应用程序的生产版本中,在特定时刻只会有一个 Redux 状态实例。因此是 Redux 三个原则中的第一个;单一事实来源。
然而,在开发中使用 Redux-dev 工具的不同之处在于,开发工具会保留您的操作历史记录以及您触发的每个操作调度的状态。这随后可能导致大量数据填满浏览器的内存,从而给人以性能不佳的感觉。
您还可以查看Redux documentation on performance,它对如何优化您的应用程序提供了一些进一步的建议。
如果您还想向我们展示您的数据在 reducer 中的结构,或者您如何处理动作调度,也许我们可以提出进一步的建议来提高您的性能。