Virtual DOM (VDOM) je lahko JavaScript objektno stablo koje opisuje kako bi UI trebao izgleda. Predstavlja jednostavnu reprezentaciju u memoriji — ne pravi browser DOM. React ga koristi jer je direktna manipulacija stvarnog DOM-a spora, a ručno je činiti na svakoj promjeni stanja sklono greškama.
Kada se stanje promijeni, React ne dodiruje stranicu odmah. Umjesto toga:
function Counter() {
const [n, setN] = useState(0);
// Each click produces a NEW virtual tree describing <button>{n}</button>.
// React compares old vs new and updates ONLY the text node that changed,
// not the whole button or the page.
return <button onClick={() => setN(n + 1)}>{n}</button>;
}
Zato napišete kod deklarativno ("korisničko sučelje izgleda ovako za ovo stanje") i React otkriva imperativne DOM operacije za vas.
document.querySelector + mutacija.