Our journey through performance is finished, and we can now optimize our applications to give users a better UX.

In this chapter, we learned how the reconciliation algorithm works and how React always tries to take the shortest path to apply changes to the DOM. We can also help the library to optimize its job by using the keys.

Once you've found your bottlenecks, you can apply one of the techniques we have seen in this chapter to fix the issue. One of the first tools you can use is to extend PureComponent and use immutable data to make your component re-render only when strictly needed.

Don't forget to avoid the common mistakes that make PureComponent less effective, such as generating new functions inside the render method or using constant as props.

We have learned how refactoring and designing your components structure in the proper way could provide a performance...