Practice
The component lifecycle has three distinct lifecycle phases:
Mounting: the component is ready to be mounted into the browser DOM. This phase covers initialisation in the
Updating: in this phase the component is updated in two ways, by receiving new props and by updating state from
Unmounting: in this final phase the component is no longer needed and is detached from the browser DOM. This phase includes the
It is worth noting that internally React has a concept of phases when applying changes to the DOM. They are broken down as follows
Render The component will render without any side effects. This applies to Pure components, and at this stage React can pause, abort or restart the render.
Pre-commit Before the component actually applies changes to the DOM, there is a moment that lets React read from the DOM through
Commit React works with the DOM and runs the final lifecycles accordingly:
React 16.3+ Phases (or the interactive version )
Before React 16.3
Comments