DEV Community

Discussion on: What is Virtual Dom? And Why is it faster?

Collapse
 
hashlucifer profile image
Harsh Mehta • Edited

Very well explain what virtual DOM is, but this doesn't justifies why VirtualDOM is faster because of 2 missing things.

  • When we say that DOM manipulation is slower, its not the Javascript manipulation using document api which is slower, but the process that browser follows after that. Which is layout calculations and pixel painting, every time after every DOM update.

So how does Virtual DOM better? Because everytime you update sometimes in virtualDOM goes the the real DOM, even though you are updating the specific parts of DOM, complexity remains same.
The answer is 2nd point

  • REACT works in batch mode in terms of updating, it updates the virtual DOM every time but updates the realDOM after some time. In this way a bulk of DOM updates goes at once, so the layout calculations and repainting cost gets reduced. In this way Virtual DOM makes things better and faster. This is usually less than 200ms so that our eyes don't comprehend the UI change.