The Virtual DOM and Component Lifecycle
When we build an application in React.js, we don't deal directly with the DOM, which is the browser's rendering mechanism and object model. Instead, React exposes a virtual DOM to the developer and keeps the implementation details hidden from them. This is what makes React so powerful. In a nutshell, when developing a React application, the developer writes React components that return data structures and the React frameworks automatically update the DOM and render the component on the UI.
Moreover, React is smart enough to calculate the smallest amount of DOM changes that are required in order to update the state of the UI, which makes React applications highly performant.
If a complex component's behavior is required by the application, such as doing something special as soon as the component is mounted or just before the component is updated, React provides lifecycle methods that the component can interact with.
