reactjs - React状态下 "Too much data"被认为是什么

标签 reactjs react-redux

我目前正在构建一个带有仪表板的应用程序,其中列出了大量统计数据。数据通过 API 加载并存储在我的组件状态中(当前不使用 redux - 只是简单的 React)。我正在加载超过 100.000(小)行数据,并将它们存储为状态数组。我的问题是:我的州的规模在什么时候会成为问题?在某些时候肯定会存在内存限制吗?数组中的 100.000 个条目有问题吗?是 1.000.000 吗?如果是,处理如此大量数据的替代解决方案是什么?这是 redux 可以提供帮助的地方吗?

最佳答案

在大多数情况下,您存储这些数据的位置并不重要,重要的是您存储的数据量。您存储的所有数据,无论是在存储中还是在静态变量中,都存储在 RAM 中。因此,您的应用程序可能会因占用过多资源而导致浏览器崩溃。

一个更好的存储解决方案(如果您绝对必须在客户端存储数据)是使用名为 IndexedDB 的东西。 。 IndexedDB 将数据存储在硬盘而不是 RAM 中

但是,在大多数用例中,建议将数据存储在后端,对其进行分页,然后根据需要仅将单个页面发送到客户端。这确保了

  • 客户端无需在应用程序运行之前加载大量数据。

  • 客户端不必在 RAM 中存储大量数据。

关于reactjs - React状态下 "Too much data"被认为是什么,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55353250/

相关文章:

react-hooks - redux-tool-kit 中的去抖动

javascript - 需要从 semantic-ui-react Form.Input 引用 <input> - 在 React 中被 div 包围

javascript - 计算对象属性的重复数组以生成新数组

javascript - 通过遏制 react 组件中的提升状态

javascript - 不同分支上的组件如何互相更新

javascript - 这个错误在 Redux - Toolkit 中意味着什么?

javascript - 一段时间后如何更改组件的类?

reactjs - 在 redux 中,为什么我们必须在 reducer 中保持状态不可变?

javascript - 预期的动态类型字符串',但 typeint64 react native

reactjs - 将 font-awesome 添加到 React 项目时出错