Optimize React Performance

Good advice every React dev should be aware of:

React is known to be blazingly fast with its Virtual DOM implementation. However, even with React’s built-in performance, there are instances when the UI can begin to feel sluggish. The primary culprit for poor performance is generating too many renders and reconciliations. We’ll cover 4 techniques to help ensure that your app is optimized and offers a snappy user experience.

1. Use key correctly
2. Manage shouldComponentUpdate
3. Extend PureComponent instead of Component
4. Build for production

Luckily, when not using keys (item #1), React will give you a console warning. To check if you’ve built for production or not (item #4), you can use the visual indicator contained in the React Dev Tools.

Optimize React Performance →