Virtual DOM in React
Virtual DOM is one of the main reason why react is more popular. Virtual DOM renders a webpage more faster than a standard webpage.
render() method present in every component returns a react element which is the plain JavaScript object which is mapped to a plain JavaScript object that maps with DOM element.
So react keeps light weight DOM in memory which refers to virtual DOM. When we change the state of the component we get a new react element. React will compare this element with its children and Identify the changes and update the DOM element.
** So when something changes:**
-
React creates an exact copy of the DOM
-
React will compare this element with its children
-
Finally Identify the changes and update the DOM element
This approach renders a webpage more faster than a standard webpage.