DEV Community

loading...

Virtual DOM

Visakh Vijayan
Willing to learn anything and everything exciting. Always awake. Skips food for fun.
・1 min read

So why is react fast. They are saying the magic is because of the virtual DOM.

A virtual DOM is a programming concept by which the system stores a copy of the DOM in the memory.

Whenever a change occurs to the VDOM, it's compared with the old VDOM and only those changes are committed to the actual DOM.

This is also called "diffing".

If we don't use React it takes a lot of time and APIs that the browser has to call to update the DOM. But with React it's easier to update the VDOM as it's a JS object. This object is optimized in such a way that it makes minimum calls to the browser DOM to update it.

Discussion (2)

Collapse
Sloan, the sloth mascot
Comment deleted
Collapse
uppercod profile image
Matias Trujillo

Hi👋, I think it's not right, since the shadow-dom and the virtual-dom are totally different.

The shadow-dom has nothing reactive, it is simply an encapsulation of content which is beneficial when working with styles and slot

The virtual-dom can easily work within the shadow-dom, I do not think that the React or Vue team will replace the virtual-dom, since it is simple 🤓