reactjs - "Reselect" VS "Memoize-One" with "React and Redux"

Question

我试图在我的 React 工作流程中使用某种记忆，我正在寻找最好的，最重要的是“最简单”的解决方案来与我的工作流程集成，包括React and Redux.

我遇到了很多关于一般记忆化的文章，有些文章展示了“memoize-one”的使用，并将其作为最快和最容易启动和运行的支持，而其他人甚至没有提到它并谈论“重新选择” .

我只想知道哪个更好，最简单，我应该投资哪个。

标签： reactjsreduxreact-reduxmemoizationreselect

Answer 1

两个库都返回一个函数，该函数接受给定数量的参数并返回一个值：

getA(arg1, arg2, arg3) // Returns a value

不同之处在于函数被调用时的底层发生了什么。

memoize-one

• 收集提供的参数
• 将参数与之前调用 ( ===)中提供的参数进行比较
• 参数相同：返回缓存结果
• 参数不相同：重新评估结果函数并返回

重新选择

• 收集提供的参数
• 运行一组inputSelectors函数，为他们提供收集的参数
• 收集inputSelectors返回值
• 将inputSelectors返回值与之前调用中获得的值进行比较 ( ===)
• 值相同：返回缓存结果
• 值不一样：重新评估结果函数并返回

结论

memoize-one是一个基于值的 memoize 实用程序：memoization在提供的 arguments的值上执行。

reselect在其之上添加了一个进一步的评估层：记忆不是对参数值执行，而是对一组inputSelectors函数的结果执行这些初始参数。

这意味着reselect选择器很容易组合，因为每个选择器都inputSelectors可以是另一个reselect选择器。