Sites built with VANILLA JavaScript directly updates the Real DOM. It is fine for smaller websites, but as your website grows complex, it slows down the website. This happens because the browser engine has to traverse all nodes even if you update only one node.

Even Angular updates or work on Real DOM. ReactJS doesn’t update the Real DOM directly but has a concept of Virtual DOM. This causes a great performance benefit for ReactJS and so it’s faster than vanilla JavaScript apps and also Angular apps.

• Virtual DOM is actually an in-memory representation of Real DOM. It is a LIGHTWEIGHT JavaScript Object which is a copy of Real DOM.
• Whenever setState() method is called in your code, ReactJS creates the whole Virtual DOM from scratch.
• At a GIVEN time, ReactJS maintains two virtual DOM, one with the UPDATED state Virtual DOM and the other with the previous state Virtual DOM.
• ReactJS uses a differential algorithm to compare both of the Virtual DOM to FIND the minimum number of steps to update the Real DOM.

After that, it updates the Real DOM, whenever it’s best to update it.