React optimizations
React, as you likely know, offers some functions for helping us in situations where our application is rendered more than desired. This feature is called reconciliation. When some component's props or state change, React re-renders and creates a thing called a virtual DOM, which is basically an object representation of our components that is used later to be compared against the actual DOM objects. If they're not equal, React will update the DOM.
The virtual DOM resides in React memory and performs all its operations on this rather than the actual browser DOM. This is because browser repaints are expensive tasks; React is smart enough to efficiently compare these object representations of our elements and decide when it should repaint our screen.
This is automatically done under the hood, but sometimes we have situations where we know that our components don't need to update. That's why React offers some life cycle events for classes, such...
