performance - React-redux 重选性能

Question

在 react redux 应用程序中使用 reselect 时，我有一个关于性能的问题。

Reselect 库用作记忆层来缓存为性能而进行的计算，但是如果您不需要完成任何计算/逻辑怎么办？

对单个数据使用选择器是否更高效，或者我应该只使用标准连接方法？

Answer 1

正如 toouchdesign 已经说过的那样。如果确实没有计算/逻辑，并且选择器只是返回对对象或状态树中某处存在的值的引用。那么就不需要记忆选择器，因为浅相等检查将由connect.

因此，在决定是使用普通选择器还是使用选择器时，createSelector一个很好的问题是：选择器每次执行时返回的这个对象、数组或函数的引用会不会不同？

人为的例子：

const getSelectedItems = state => state.items.filter(i => i.selected)

每次调用选择器时都会产生不同的数组。

然而：

const getFullName = createSelector(
  state => state.items,
  items => items.filter(i => i.selected)
)

如果items数组发生变化，只会返回一个新数组。

因此，尽管将选择器计算的复杂性视为决策的基础可能很诱人，但引用的缓存是实现性能优势的关键因素，reselect因为它将减少不必要的渲染。因此，虽然选择器本身的记忆可以带来性能优势。不要忘记缓存引用本身可以带来的性能优势。

Answer 2

当您不需要任何计算/逻辑时，只需编写一个简单的选择器，它接受应用程序状态和可选的进一步输入作为参数。像这样：

const getAnItemById = (state, itemId) => state.items.find(item => item.id === itemId);

然后通过 Redux 将您的选择器连接到您的组件connect。

reselect如果您不需要缓存/记忆超能力，请不要使用！