React Philosophy

React is an isomorphic/universal framework.

That means that there is a virtual representation of the UI component tree, and that is separate from the actual rendering that it outputs in the browser.

React is so fast because it never talks to the DOM directly.

• React maintains a fast in-memory representation of the DOM.

Virtual DOM is just a DOM-like data-structure that represents all the UI components hierarchy and additional meta-data.

• Virtual DOM is just an implementation detail.

React is Rendering agnostic, which means that it doesn't care about what is the final output. It can be a DOM Tree in the browser, it can be XML, Native components or JSON.

Lifecycle

Applications built with just React usually have a single root DOM node.

React elements are immutable. Once you create an element, you can’t change its children or attributes. An element is like a single frame in a movie: it represents the UI at a certain point in time.

React DOM compares the element and its children to the previous one, and only applies the DOM updates necessary to bring the DOM to the desired state.

Mounting

React modifies the DOM by:

• "mounting" (adding nodes to the DOM)
• "unmounting" (removing them from the DOM)
• "updating" (making changes to nodes already in the DOM).

So when you render, you are mounting to an existing DOM.