1 views collected around this technical thread.
Swizec Teller argues that in most React projects the useCallback and useMemo hooks are unnecessary, explains how they work, shows common pitfalls, and provides concrete alternatives for writing cleaner, more efficient components without over‑optimizing.
This article explains how parent and child components interact in React, why certain child components re‑render on state changes, and how techniques like React.memo, useCallback, and useMemo can be used to control rendering performance.
This article explains common React performance‑optimization methods, walks through a real‑world form‑editor use case, details the profiling, diagnosis, and step‑by‑step improvements—including memoization, callback stabilization, diff filtering, and pure‑function components—that reduced render time from 195 ms to under 10 ms.
This article explores the purpose and proper usage of React's useCallback hook, examines common pitfalls, and demonstrates how to build and enhance a reusable countdown custom hook, including handling callbacks, effect dependencies, and ref-based solutions for stable function references.
This article explains React's internal update loop, the render and commit phases, default bailout optimizations, and how developers can accelerate rendering using techniques such as state lifting, content lifting, React.memo, useMemo, and useCallback while avoiding over‑optimization.
This article explains the three main reasons function components re‑render—useState/useReducer updates, parent updates, and context changes—and shows how to control unnecessary renders with techniques such as memoization, useCallback, useRef, and component extraction.
This article explains how to improve performance of long React pages by rendering components screen‑by‑screen using viewport detection (getBoundingClientRect or Intersection Observer), grouping data, debouncing scroll handlers, and applying React.memo to prevent duplicate data requests.
This article explains how React.memo, its second‑argument comparator, and the related hooks useCallback and useMemo can be used to avoid unnecessary re‑renders, handle function props correctly, and dramatically improve rendering performance in complex functional components.