What are virtual Doms and how do they work?

Posted by Andre Scott | Updated on

React’s Virtual DOM function is one of the platform’s key functions, so you need to be able to explain it clearly.

  • When web browsers render HTML documents and turn them into a website or application on a screen, they create a representational tree of how the site or app is arranged called a Document Object Model (DOM).
  • Without React, your website or app will use HTML to update its DOM in order to make things “change” on screen without users needing to manually refresh a page. React JS takes a different approach by creating a Virtual DOM—a copy of the site’s “actual” DOM.
  • React uses this copy to determine what parts of the actual DOM need to change based on a user’s action. React then takes the change date from the Virtual DOM and selectively updates the actual DOM (versus reloading the entire thing). Over time, this leads to significant performance improvements for the website or application.

If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.

Related Questions & Answers