useMemo 钩子的用例

Ven*_*sky 2 memoization reactjs react-hooks

查看 React 的useMemo 文档。他们说当你需要计算昂贵的计算时使用它。

这种优化有助于避免每次渲染时进行昂贵的计算。

我查看了他们提供的memoized 链接,我了解到您可以将其视为缓存。

我不是计算机科学专家,但我知道记忆法是计算斐波那契数的一个很好的优化

我仍在努力更好地理解为什么以及如何使用useMemo,但有些事情我仍然不清楚。

  • 什么是考虑expensive calculations
  • 有人可以举出真实的react例子吗?
  • 在什么情况下useMemo有利于性能优化?

Shu*_*tri 8

首先,您应该知道您只能记住纯函数,即输出完全取决于其参数的函数。

所以简而言之,当您知道大多数情况下输入保持不变并且您不希望不必要地一次又一次地重新计算相同输入的结果时,您会进行记忆,特别是当计算很昂贵时,这可能意味着数据集需要执行的计算量很大

  • 当您尝试从大型数组中过滤数据时,使用记忆化的一个例子是 React。

  • 另一种情况是当您希望将基于某些参数的嵌套对象转换为其他对象或数组时。

在这种情况下useMemo真的很有帮助。如果数组和过滤条件在重新渲染时保持不变,则不会再次进行计算,而是从缓存中返回先前计算的数据