状态数据变大怎么办？

Question

这就是我所拥有的：

state.groupTypes.list=[];

当我调用api并将其保存到状态树state.groupTypes.list

时，列表中将包含项目。

//with paging and 10 item per page
getList(params)

恐怕state.groupType.list的记录超过一千个记录时，它将消耗设备的所有内存，因此我找到了一种解决方案：状态最多只能保存100条记录。因此，当它到达第10页时，该状态将删除前10条记录，并从api中推送新记录。 是否有解决此问题的建议，我的解决方案有可能吗？

Answer 1

您应该使API具有分页支持 假设要在应用程序中实现无限滚动，则向服务器发送请求，例如“ https://www.example.com/list/page1” 并收到响应，您将收到一个包含5个项目的数组，并且当用户滚动到列表底部时，您再次向服务器“ https://www.example.com/list/page2”发送请求

全部

Answer 2

对象内容的大小与以状态存储对象无关。该对象未复制，已被引用。

但是，如果人们不是由组件管理的，那么它就不是组件状态的一部分，因此状态不是应该存在的状态。该组件应仅在导入该数据时关闭，或使用表示该数据的上下文，或在道具中接收它，等等。

在React状态下拥有大量数据非常好。在那里可以存储的内容实际上没有限制，而且React状态本身对其可以存储的大小没有任何限制。

大数据集的问题随渲染此类数据而出现。例如，如果您有一个需要渲染数千行的表，它将降低浏览器的速度。不过，我们谈论的是成千上万的条目，根本不应该成百上千的问题。

如果您发现自己必须渲染成千上万个数据点，则可以使用可以帮助实现此目的的组件/库，例如React Virtualized，它只会渲染所需的元素，而不会渲染所有元素。

如您所见，问题不是存储的是什么，而是渲染的。我的建议是在发现性能问题之前不要担心要渲染的内容，一旦达到这一点，就需要开始优化。

除非您确定会遇到性能问题，否则从一开始进行优化可能会使您浪费更多时间在其他地方花费时间。