Summary
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 keys. Once you’ve found your bottlenecks, you can apply one of the techniques we have seen in this chapter to fix the issue.
We have learned how refactoring and designing the structure of your components in the proper way could provide a performance boost. Our goal is to have small components that do one single thing in the best possible way. At the end of the chapter, we talked about immutability, and we’ve seen why it’s important not to mutate data to make React.memo
and shallowCompare
do their job. Finally, we ran through different tools and libraries that can make your applications faster.
In the next chapter, we’ll...