What is the Virtual DOM and why does Vue use it?

The Virtual DOM (VDOM) is a lightweight in-memory JavaScript representation of the actual DOM. When state changes, Vue generates a new virtual tree, diffs it against the previous one, and applies only the minimal set of real DOM updates needed (patching), instead of re-rendering the whole page.

This is used because direct DOM manipulation is comparatively expensive; batching and minimizing real DOM writes improves performance. Vue 3's compiler also adds 'patch flags' during compilation, marking which parts of a template are dynamic, so the diffing algorithm can skip static content entirely — a technique called compiler-informed virtual DOM.