What the Fork is the React Virtual DOM
Evergreen
🌳Last tended Jan 20, 2019
React
Web Development
JavaScript
Illustrated Notes
When I was first
The idea of the virtual DOM system helped clarify a few things for me. Primarily it got me to understand the DOM, the virtual DOM, and your React app are all separate systems talking to one another. Not one big mesh. While learning it I drew out an explanation you can see below.
⚠️
HOWEVER
This post is slightly dated, and the React team isn't keen on the term "Virtual DOM" as a mental model for how React works under the hood.
I wish we could retire the term “virtual DOM”. It made sense in 2013 because otherwise people assumed React creates DOM nodes on every render. But people rarely assume this today.
— Dan (@dan_abramov)
“Virtual DOM” sounds like a workaround for some DOM issue. But that’s not what React is.November 24, 2018
Instead Dan wrote up a nice long explanation on
They still have a section of the docs about the
The below explanation will still help you understand the basic concept that React figures out what needs to change on the DOM before changing it, but go to other sources if you want a more in-depth explanation.
Want more illustrated notes on web development?
Take a look at