What is the virtual DOM in React and why does React use it?

The virtual DOM is a lightweight in-memory tree of React elements. React compares it to the previous tree (reconciliation) to compute minimal updates to the real DOM, which avoids expensive full-page reflows for most UI changes.

When state or props change, React creates a new element tree. The reconciler walks old vs new trees, keys children where possible, and produces a set of DOM operations. This batching and diffing is what people mean by “virtual DOM” in practice—not a second browser DOM, but React’s representation used for efficient patching.