useSelector 和 reselect ，哪一个对性能有利

Question

出于记忆/性能考虑，使用useSelector with ShallowEqual. 使用“Reselect/createSelector”选项对性能优化会有更多好处吗？或者两个选项是相同的？

大多数选择器都会将数据作为 JSON 数组对象。

在编写新的选择器之前，想考虑性能/记忆的好处。

Answer 1

// Example
const selectAndCompute = (state) => {/*expensive computation*/};

const MyComponent = (props) => {
   const computedData = useSelector(selectAndCompute);
   return '...';
}

useSelector MyComponent如果函数计算的selectAndCompute结果与上次触发的结果相同（并且每次 redux 状态发生变化时都会触发），将阻止重新渲染。但是，这仍然需要selectAndCompute运行并计算一些结果。这种计算本身可能会很昂贵。

因此，您可以添加reselect'createSelector来阻止甚至在selectAndCompute. 例如，如果仅取决于您可以定义的selectAndCompute状态部分：state.transactions

const selectAndCompute = createSelector(
  [(state) => state.transactions], 
  (transactions) => {/*expensive computation*/}
);

现在，只有当state.transactions发生更改时，昂贵的计算才会运行，否则selectAndCompute将立即返回以前的值。最后useSelector将阻止重新渲染，就像reselect未使用时一样。