Tag

re-render

1 views collected around this technical thread.

KooFE Frontend Team
KooFE Frontend Team
Aug 14, 2022 · Frontend Development

Mastering React Re-renders: When, Why, and How to Optimize Performance

This comprehensive guide explains what React re‑renders are, distinguishes necessary from unnecessary re‑renders, outlines the four triggers—state, parent re‑render, context, and hooks—and provides practical patterns and anti‑patterns, including memoization, useMemo/useCallback, and key management, to improve component performance.

ContextReactkey
0 likes · 15 min read
Mastering React Re-renders: When, Why, and How to Optimize Performance
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Dec 9, 2021 · Frontend Development

Why Do Function Components Re‑Render? A Deep Dive into Hooks and 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.

HooksReactReact.memo
0 likes · 12 min read
Why Do Function Components Re‑Render? A Deep Dive into Hooks and Optimization