React. What is a “rerender” (I)

In this article you will be able to learn everything behind a “rerender” in React: what causes them, how to avoid them, and patterns and anti-patterns to take into account to optimize our applications.

Gerardo Fernández
5 min readJan 24, 2023
Photo by Sebastian Svenson on Unsplash

In my opinion, understanding the key concepts of a library is essential if we want to feel comfortable working with it. That is why I wanted to write an article focused on the cornerstone on which React was created: the “renders”. Despite the evolution that it is undergoing in the last months, React has not separated from that initial idea by which we create interfaces through components that return JSX.

Understanding this process that we know as “rendering” and the events that trigger it is key if we want to design optimized applications while laying the foundation for further improvement. One way or another, when we work with React we end up talking about “renders”, so why not learn how they work?

I have decided to divide the content of this article about React and “rerenders” into two parts so that it does not end up too long and you have

--

--

Gerardo Fernández

Entre paseo y paseo con Simba desarrollo en Symfony y React