最近一直在做项目性能优化的工作，在排查性能方面的问题时发现项目中很多地方都存在重复渲染的问题，审查代码后发现其中存在不少滥用或者说误用 useMemo、useCallback、useContext 的

当谈论 React 的性能问题时，不可避免的一个话题就是组件的 re-render 重复渲染。React 的组件需要关注两个阶段 初始阶段渲染： 当组件第一次挂载时 重复渲染： 组件已挂载，需要更新组

为了更好地满足开发者对于细粒度性能控制的需求，React推出了useMemo这一Hook，允许我们针对复杂的计算进行精细化的优化，从而避免不必要的渲染重复。

useContext为我们解决多层嵌套传值的问题，本文主要讨论了useContext跨层级组件共享状态的知识和性能方面的注意项。

「这是我参与11月更文挑战的第13天，活动详情查看：2021最后一次更文挑战」 🌊 作者主页：海拥 🌊 作者简介：🥇HDZ核心组成员、🏆全栈领域优质创作者、🥈蝉联C站周榜前十 🌊 粉丝福利：进粉丝群每

现在写 react 组件基本都是 function + hooks 了，因为 hooks 很强大也很灵活。 比如 useState 可以声明和修改 state，useEffect 可以管理异步逻辑，u

在这篇文章中，我们对 React 的 useRef 进行了深入的探讨，透过实际代码，再现了useRef绝大多数应用场景，无论你是 React 新手还是老手，相信本文都能为你提供有价值的知识。

React更新机制 - React函数组件中 useState set方法更新时浅对比过程中都发生了什么。

`useCallback` 接收一个函数和一个依赖项数组作为参数，然后返回一个 memoized 版本的函数。如果依赖项数组中的任何一个依赖项发生更改，则 `useCallback` 会返回一个新的函