何时使用 memo?
当组件的 props 没有变化时,memo 可以跳过重新渲染。适用于渲染开销较大的纯展示组件。
useCallback 与 useMemo
useCallback 缓存函数引用,避免子组件因函数引用变化而重渲染;useMemo 缓存计算结果,适合耗时计算。
常见误区
- 不要对所有函数都用 useCallback,只在传给 memo 子组件时才有意义
- useMemo 的依赖数组一定要准确,否则会产生 stale closure
- 过早优化是万恶之源,先 Profile 再优化
当组件的 props 没有变化时,memo 可以跳过重新渲染。适用于渲染开销较大的纯展示组件。
useCallback 缓存函数引用,避免子组件因函数引用变化而重渲染;useMemo 缓存计算结果,适合耗时计算。