In this post, I am also explaining the same thing.
What modern frameworks like react does is whenever something is changed in the state/props, a new virtual DOM representation will be created and it will be compared with the previous one. In our example, the only change will be "Apple" to "Pineapple". Since only text is changed instead of replacing whole list.
VDOM figures out which element or part of DOM changed by using reconciliation process and updates only that part.
No, virtual DOM is not faster than the real DOM. Under the hood virtual DOM also uses real DOM to render the page or content. So there is no way that virtual DOM is faster than real dom.
What I meant was you cannot compare apples and oranges. Virtual DOM is not another type of DOM, it is just a representation of DOM. So we should not say Virtual DOM is faster.
React docs state that
The virtual DOM (VDOM) is a programming concept where an ideal, or “virtual”, representation of a UI is kept in memory and synced with the “real” DOM by a library such as ReactDOM. This process is called reconciliation.
Since “virtual DOM” is more of a pattern than a specific technology, people sometimes say it to mean different things.
As you can see above it is a pattern or technique. The reason we should not say that VDOM is faster than actual DOM is because in the end Virtual Dom is going to update the actual DOM.
I am not getting what you disagree.
In this post, I am also explaining the same thing.
VDOM figures out which element or part of DOM changed by using reconciliation process and updates only that part.
I'm sorry I was not clear. I meant I disagree with the fact that VDOM is not faster
What I meant was you cannot compare apples and oranges. Virtual DOM is not another type of DOM, it is just a representation of DOM. So we should not say Virtual DOM is faster.
React docs state that
As you can see above it is a pattern or technique. The reason we should not say that VDOM is faster than actual DOM is because in the end Virtual Dom is going to update the actual DOM.
Yeah, I kind of get your point