reactjs - React Native 应用程序中的 Redux 非常慢，有大量数据

Question

我将大量 JSON 对象存储在单个 Redux 变量中(约 8k 个项目，每个对象大约 1kb，总共 8mb)。这似乎使 Redux 调用变慢，即使是最琐碎的 Action 和实际上什么都不做的 reducer 。例如，调用此 doNothing() action 和 reducer 在设备上产生 500 毫秒的等待时间，而无需在调试器上运行:

// action
export const doNothing = () => {
  return {
    type: DO_NOTHING
  };
};

// reducer
export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case DO_NOTHING: {
      return state;
    }
    default:
      return state;
  }
};

我最好的分析这个问题的尝试是通过 slowlog ，这就是我在 React 组件中为 Redux 调用得出 500 毫秒数字的地方。对于较小的数据集(约 500 项)，我仍然需要等待，但接近 100 毫秒。这一切都在设备上，在模拟器和调试器上会变慢。我正在一个简单的 View 上测试这个，只有一个按钮，以排除昂贵的重新选择和重新渲染的并发症。一个可能的复杂情况是我正在使用 redux-offline它将 Redux 存储持久化到 AsyncStorage ，但是当我关闭持久性时，我的性能同样很差。

理想情况下，我会直接解决瓶颈问题，但我也愿意接受变通方法。我尝试将 Action 调用包装在 setTimeout 中，但这似乎只是延迟了我的 React Native 应用程序的减速。

提前感谢您的任何建议!

Answer 1

将大量数据存储在 redux 状态并间接存储在 RAM 中并不是一种可靠的方法。
最佳做法是使用本地数据库，以便将数据存储在存储内存中。
对于 ReactNative，有一个流行的数据库 Watermelon DB适合这种场景
请查看它的文档:https://nozbe.github.io/WatermelonDB/
这是它解决的问题

For simple apps, using Redux or MobX with a persistence adapter is the easiest way to go. But when you start scaling to thousands or tens of thousands of database records, your app will now be slow to launch (especially on slower Android devices). Loading a full database into JavaScript is expensive!

Watermelon fixes it by being lazy. Nothing is loaded until it's requested. And since all querying is performed directly on the rock-solid SQLite database on a separate native thread, most queries resolve in an instant.

使用西瓜数据库存储/检索大数据
同时，使用 redux 状态仅存储小数据。
希望这有帮助🤝