React useEffect useMemo useCallback区别要点
2022-11-27
useEffect 渲染完毕后执行,产生副作用,依赖自身state时,不用setState,多数情况依赖props。
useMemo 组件首次加载和重渲染期间执行,缓存值,性能优化手段,对于当前组件高开销的计算优化。
useCallback 会在渲染期间执行,缓存函数,性能优化手段,对于子组件渲染优化,当做函数传递时候。
- 请不要在这个useMemo函数内部执行与渲染无关的操作,诸如副作用这类的操作属于 useEffect 的适用范畴,而不是 useMemo。
- useMemo 返回缓存的 变量,useCallback 返回缓存的 函数。
- 启动缓存是有代价的,开销小的变量和函数无需缓存,不然会适得其反。
参考资料
https://blog.csdn.net/yoonerloop/article/details/125193784
https://blog.csdn.net/m0_57785190/article/details/118601740