Real Dom and Virtual Dom

real dom and virtual dom

1. 1Real DOM is the actual HTML structure rendered in the browser.
2. 2Updating Real DOM is slow because it re-renders the entire page or large sections.
3. 3Virtual DOM is a JavaScript-based copy of the Real DOM created by React.
4. 4When state or props change, React updates the Virtual DOM first.
5. 5React compares the updated Virtual DOM with the previous one (diffing).
6. 6React finds the difference and updates only the changed part in the Real DOM.
7. 7This update process is called reconciliation
8. 8Using Virtual DOM improves performance by avoiding unnecessary Real DOM updates