"Shawn, React uses virtual DOM to keep track of what has changed in the real DOM. It's concept is very easy to understand. React always keeps a copy of the representation of the actual DOM in memory. Whenever something changes, such as some state manipulation, it calculates another copy of the DOM that will be generated with new state and props. Then it calculates the difference between the original copy of the virtual DOM and the new copy of the virtual DOM. This difference results in minimal operations on the real DOM that can take the current DOM to a new stage. In this way, React does not have to do major changes when something changes." Mike explained.
"But isn't the diff calculation expensive?" asked Shawn.
"It's not expensive when you compare it with actual DOM operations. Manipulation of DOM is always expensive. The comparison of virtual DOM occurs in JavaScript code, so it is always faster than doing manual DOM operations." said Mike.
"Another advantage of this approach...