为什么默认情况下不是所有 React 组件都用 React.memo() 包装？

Question

我刚刚了解到React.memo()并想知道，我们什么时候不想要这种行为？我们不是总是希望组件仅在其 props 发生更改时才重新渲染吗？

Answer 1

这是因为记忆本身不是免费的，你不应该在任何地方使用它。因为：

• 记忆化本身在比较一个渲染与下一个渲染的值时会产生性能成本。在某些罕见的情况下，这实际上可能大于渲染成本。
• 您无法编写适用于每种情况的通用比较函数。反应备忘录的第二个参数很重要。开发人员在其中定义组件应该重新渲染的 props 的具体更改。这通常比简单的 1:1 道具更改在两个方面更复杂。首先，要比较的值可能不是可以轻松比较的值（如字符串或整数），而是复杂的对象或对函数的引用等。其次，您可能只希望在某个组合的 prop 更改时进行重新渲染发生。因此，通过在任何地方启用它，您将要求开发人员为系统中的每个组件考虑这一点，这将是一项非常庞大且容易出错的任务。对于大多数组件来说，这也可能带来很少的增益。仅当您有问题需要解决时才应该执行所有这些操作。
• 当您遇到性能问题时，记忆化很有用，但在您解决问题之前，使用它并不是一个好主意，因为它也会大大增加应用程序中出现错误的可能性。如果你错误地比较了一个 prop，或者在 的情况下useMemo，忘记向 deps 数组中添加一些东西——你的应用程序现在有一个错误。由于这是开发人员管理的事情——会发生人为错误。当毫无戒心的开发人员扩展了记忆组件的 API 然后不更新比较函数时，这种情况通常会经常发生。完全相反的情况也可能发生在记忆化函数以这样的方式编写的情况下，即它将接受并比较新的道具而无需更改，但该比较（就像如果它比较一个对象，每次都会是一个差异引用）实际上结束了无论如何，每次都会触发重新渲染，使整个事情变得毫无意义（错误的安全感）。

简而言之：记忆是一种维护负担，您应该仅在个人和特定情况下通过成本效益分析来承担这一任务。