如何在 Redux 中存储已排序的集合，并通过各种键快速对其进行排序？答案

【问题标题】：How do I store a sorted set in Redux, and quickly sort it by various keys?如何在 Redux 中存储已排序的集合，并通过各种键快速对其进行排序？
【发布时间】：2016-10-26 15:52:46
【问题描述】：

如何在 Redux 中存储排序集？

假设我有一个包含大量数据的电子商务网站，但客户只有一小部分数据。我将该数据存储为一个对象（键是 ID），并将主排序存储为一个数组。

问题是，当我添加越来越多的无序数据时，更新该数组将花费 O(n^2) 并且速度很慢。

我自然会使用排序集，但我不确定如何在 Redux 中实现它。

data = {
  <listingID>: <listingData>,
  ...,
  728: {
    name: 'Massive 1BR apartment in prime location',
    price: 4000,
    sqFeet: 1000,
    bedrooms: 1,
    location: 'East Village'
    datePosted: 1477496361164
  },
  1467: {
    name: 'Amazing 2BR steps from Times Square',
    price: 3950,
    sqFeet: 820,
    bedrooms: 2,
    location: 'Midtown',
    datePosted: 1427496322083
  },
  ...
}

order = [..., 728, 1467, ...]

【问题讨论】：

在您希望展示前 25 个左右时，假设您在 redux 存储中拥有整个大型数据集是否安全？
很遗憾，我的商店中没有整个数据集。想想房地产网站的主页。它只会显示前 25 个列表，但当您向下滚动时会继续显示更多列表。但是您可以按某些变量进行过滤（例如，仅 2BR），因此您正在向巨型对象添加更多无序数据。
好的。问题的第一部分 (Say I've got a large dataset in a Redux store) 似乎暗示你已经在商店里拿到了所有东西。如果你在任何时候都只维护 store 中的 top 25-ish 并且排序是在后端完成的，那么速度问题可能与 Redux 无关，而是变成了 Node + db + 分页问题。如果用户滚动到 50 而不是 25 perf 可能仍然不是问题。如果您担心用户只对他们加载的内容进行排序，那么大多数用户可能不会滚动到足以加载有问题的数据量。
好的将更正问题。也许忽略排序的事情。基本上我只想能够将随机数据添加到集合中，并让保存排序的数据结构自动更新。基本上我想要的是一个排序集（例如按日期排序）。然后我可以根据我想要的任何顺序（例如价格、平方英尺）对集合进行排序
另见Normalizing State Shape和Managing Normalized Data

标签： javascript node.js sorting reactjs redux

【解决方案1】：

在 Redux 中管理数据的标准方法是以“规范化”形式存储数据，使用 ID 作为键的查找表。要跟踪排序，请使用 ID 数组。这些数组可以在你的 reducer 中构建并保存在 store 中，或者根据需要使用“selector”函数派生。

我鼓励您阅读 Redux 文档中新的 "Structuring Reducers" 部分，其中详细介绍了该主题。

【讨论】：

我对将排序作为数组处理的担忧是，随着您添加越来越多的无序数据 (O(n^2))，这可能会变得非常慢。
老实说，我不会担心它，除非您谈论的是数十万个项目，和/或有证据证明这是一个合法的性能问题。对于所有性能问题，真正的答案是首先进行基准测试。

【解决方案2】：

我将如何解决这个问题是在组件级别使用本地状态和 javascript 的本机 .sort() 来解决，而不是回到整个 redux 状态/reducer。我认为这尤其适用于你的 redux reducer 与本地 state 中有不同的数据集。

我认为他们的代码中有一些错误，但这里是 Facebook 的带有排序功能的数据表：https://facebook.github.io/fixed-data-table/example-sort.html。

【讨论】：