React开发中对所有组件使用React.memo是否为良好实践？

React 提供了 React.memo 方法实现组件记忆化，若组件的props未发生变化，该方法可阻止组件进行不必要的重新渲染。
基础使用示例如下：

import React, { memo } from 'react';

interface ComponentNameProps {

}
const ComponentName:React.FC<ComponentNameProps> = props => {
    const {} = props;
    return (
        <div>
        </div>
    )
}
export default memo(ComponentName)

答案是否定的，全局给所有组件加memo不属于良好的React开发实践，原因如下：

• memo本身存在固定性能开销：每次父组件触发重渲染时，被memo包裹的组件都会先执行一次props浅比较逻辑，再决定要不要重渲染组件本身。如果是渲染逻辑非常简单的轻量组件（比如仅返回少量文本、基础标签的小组件），浅比较的开销甚至会高于直接重渲染组件的开销，反而带来负优化。
• 纯加memo通常很难生效：如果组件接收的props包含函数、对象、数组这类引用类型的值，只要父组件渲染时重新生成了这些引用（比如内联写的回调函数、字面量定义的样式对象），memo的浅比较就会判定props发生了变化，记忆化直接失效。此时如果要让memo生效，还需要额外配合useCallback、useMemo等钩子稳定props引用，反而大幅提升了代码的复杂度和维护成本。
• React原生渲染效率已经足够优秀：React内置的虚拟DOM Diff算法做了大量优化，常规业务场景下大多数组件的重渲染开销极低，用户完全感知不到，没必要为了这种可忽略的性能损耗全局增加冗余的memo逻辑，反而降低代码可读性、提升调试成本。

只有满足以下场景时，才推荐使用memo做组件记忆化：

• 组件本身渲染成本极高，比如复杂的图表组件、包含数千条子项的列表组件，重渲染时会产生明显的性能卡顿
• 组件会被频繁触发重渲染，比如挂载在高频更新的父组件下、本身是高频交互的组件
• 组件的props大多是基础类型，或者引用类型props可以轻易做到稳定不变

内容的提问来源于stack exchange，提问作者Varun Sukheja