React 基础:渲染性能与 useCallback

💡 原文英文,约300词,阅读约需1分钟。
📝

内容提要

即使使用 `memo` 包装子组件,当函数作为 `props` 传递时,子组件仍会重新渲染。在 `Example.js` 中,通过 `useCallback` 包装 `clickHandler` 函数可以避免这种情况,提高性能。

🎯

关键要点

  • 即使使用 memo 包装子组件,子组件仍可能重新渲染。
  • 当函数作为 props 传递给子组件时,子组件会重新渲染。
  • 在 Example.js 中,clickHandler 函数会导致子组件重新渲染。
  • 使用 useCallback 包装 clickHandler 函数可以避免子组件重新渲染,提高性能。
➡️

继续阅读