In the Render phase, React will execute all your app components and resolve the JSX tree. If it is the first time rendering, React will return all the JSX tree but if the render is an update like the most of the times, React will compare with the old one and compute a diff. This process is called “Reconciliation”.

The first virtual DOM is when react render the entire JSX tree. The second one is the modified Virtual DOM and as you can see, react compare the new with the old one. It's like we have two snapshots at the same repository than we compare and compute the diffs.

After computing diffs, React goes to the Commit phase.

Commit phase is the process that React does to update the DOM. Is all about applying the visual updates to your website.

Hope you enjoy it!