How would you optimize rendering a list of 10,000 nodes in a React application?

Rendering 10,000 DOM nodes in React is expensive because each node consumes memory and forces layout. Virtualization solves this by rendering only the visible subset. Libraries like react-window or react-virtualized create a window that maps scroll position to a slice of the data array. The component renders only ~20–50 rows at a time, while the rest are represented by empty space. You also need to provide a stable key and a fixed row height or use VariableSizeList for dynamic heights. This reduces the number of mounted components, lowers memory usage, and improves scroll performance. Additionally, use memoization or React.memo to prevent unnecessary re‑renders of rows that haven’t changed.