First of all – the Virtual DOM was not invented by React, but React uses it and provides it for free.
A virtual DOM is a lightweight JavaScript object which originally is just a copy of the real DOM. It is a node tree that lists the elements, their attributes, and content as Objects and their properties.
The Virtual DOM is an abstraction of the HTML DOM. It is lightweight and detached from the browser-specific implementation details. Since the DOM itself was already an abstraction, the virtual DOM is, in fact, an abstraction of an abstraction
Shadow DOM creates small pieces of the DOM object which has their own, isolated scope for the element they represent.