React hooks 实践经验

760 阅读1分钟

该不该使用useMemo

首先,记住useMemo本身也有开销。

并不是useCallback、useMemo一包裹,性能就提升了。

那么:

哪些需要记住?

  • 开销大的函数,需要记住。
    • 那么哪些算开销大?
      • Array.map Array.forEach?不算,这些函数本身都是优化过的
      • 创建函数?不算,现代浏览器来微乎其微
      • cloneDeep?如果拷贝一个很大且层次很深的数据,算开销大
  • 引用类型值,且:
    • 作为props传递给下游组件,会影响子组件重新渲染的引用值,需要被记住
    • 作为依赖,用到其他Hook中,需要被记住

哪些不需要记住?

  • 原始类型值,不需要记住
    • 如果是string/boolean/bumber/symbol/undefined这类原始值,不存在'引用'概念,每次计算出来的值是相等的,也就没必要记住,完全可以去掉useMemo。
  • 仅在组件内部用到的引用类型,object/array/function等,不需要记住

references