React Optimization Cookbook

Optimizing your application is key to being able to provide your users with a clean and pleasurable experience.
To make your app as performant as possible, you have to send to the browser the least amount of code possible. Also, you want to render the least amount of components on a page at a time as necessary. Then you also want to rerender components in the least amount of time possible.
Tyler has found that working in enterprises and startup cultures that, as you get more developers in a team and as your application grows, a lot of these little practices become ignored or forgotten or missed on a refactor or a pull request. They start to build up over time. Then, at the end of the day, you have a slow-performing app. You go through it, and you have to do all these little updates.
In each one of these lessons, Tyler going to be adding and deleting code to walk you through how to optimize a React app using a dashboard React app as the example.

• Course Introduction: React Optimization Cookbook
• Debounce Callbacks on DOM events in React Apps
• Use the React Production Build
• Virtualize Long Lists of Data in React
• Tree Shake Your React Application Modules
• View Package Sizes in a React App with Webpack Analyzer
• Containerization of State within Child React Components
• Profile React Components with the Devtools Profiler
• Optimize Function Components with React.memo
• Memoized Values with React useMemo
• Memoize a Function with useCallback in React
• Add the why-did-you-render Package to Catch Unnecessary Updates in React
• Code Split Components with React Lazy & Loadable Components