React does not automatically re-render when a state changes at this time.
Manually utilising the memo APIs, useCallback(), and useMemo() functions can help to optimise these re-renders. This was considered a “reasonable manual compromise” by the React team.
Their plan was to delegate these re-renders to React.
However, the React team discovered that manual optimisation is time-consuming, and community comments motivated them to find a solution.
Thus, the “React compiler” was developed by the React Team. These re-renders will now be handled by the React compiler. React will automatically determine when and how to update the user interface and change the state.
This eliminates the need for us devs to perform this manually. It also implies that useCallback(), memo, and useMemo() are not necessary.
Although this will be included in a future release of React, these sites will teach you more about the compiler:
React Compiler podcast episode
React Compiler video
React will therefore choose what to re-render and which components to optimise at what time.
One of my favourite things about React is that the teams test new features on their production products before releasing them to the public.
Instagram is powered by React Compiler in production right now. Ain’t this amazing?
