Measure with the Profiler first, use useMemo for expensive computations, useCallback for stable handlers passed to memoized children, combine with React.memo, keep state local, and avoid inline object and function references as props.

Because optimization without measurement is guesswork. The Profiler shows which components are actually slow or re-render unnecessarily, so you optimize the real bottleneck and do not add overhead where it is not needed.

Wrap a child in React.memo so it only re-renders when props change by reference. Pass stable values with useMemo and stable functions with useCallback, so the child does not re-render when the parent re-renders but props have not meaningfully changed.