What is the Virtual DOM and how does React use it to render pages?

The Virtual DOM is a lightweight, in-memory representation of the real DOM. When state changes, React creates a new Virtual DOM tree, diffs it against the previous one (reconciliation), and batches modifications to update only the changed nodes in the real DOM, optimizing rendering speed.