How Diffing Algorithm Works?
- First, the content is rendered on the webpage and the DOM tree is created.
- On change in any content due to user interaction or change in data from API,React works on observable patterns, hence, whenever there is a change in the state, it updates the nodes in the virtual DOM
- In reconcilliation the old tree is compared to the newest version to determine the number of changes needed for updation.
- After determining the changes a set of optimized and minimal instruction is created to implement on the real DOM.
- These changes are then implemented and only content that changed is re-rendered on the web pages.
What is Diffing Algorithm ?
Diffing Algorithm in React JS differentiates the updated and previous DOM of the application. DOM stores the components of a website in a tree structure. React uses virtual DOM which is a lightweight version of the DOM. The only difference is the ability to write the screen like the real DOM, in fact, a new virtual DOM is created after every re-render.
Contact Us