React Hooks in Action

7 Managing performance with useMemo

This chapter covers

• Using the useMemo hook to avoid rerunning expensive computations
• Controlling useMemo with a dependency array
• Considering the user experience as your app re-renders
• Handling race conditions when fetching data
• Using JavaScript’s optional chaining syntax with square brackets

React is great at making it easy to display data in efficient, appealing, and responsive ways. But simply throwing raw data onto the screen is rare. Whether our apps are statistical, financial, scientific, entertaining, or whimsical, we almost always manipulate our data before bringing it to the surface.

Sometimes that manipulation can be complicated or time-consuming. If the time and resources spent are necessary to ...