React Reconciliation

When a component’s props or state change, React decides whether an actual DOM update is necessary by comparing the same with Virtual DOM. If it is not equal React will update the DOM.

React maintains two Virtual DOM at each time, one contains the updated Virtual DOM and one which is just the pre-update version of this updated Virtual DOM. Now it compares the pre-update version with the updated Virtual DOM and figures out what exactly has changed in the DOM like which components have been changed. This process of comparing the current Virtual DOM tree with the previous one is known as ‘diffing’.

The algorithm used for diffing is known as Diffing Algorithm.

Once React finds out what exactly has changed then it updated those objects only, on real DOM. React uses something called batch updates to update the real DOM. It just means that the changes to the real DOM are sent in batches instead of sending any update for a single change in the state of a component. This entire process of transforming changes to the real DOM is called Reconciliation

References

geeksforgeeks