Let’s Talk about Re-renders

React Summit

I am attending the biggest #Reactjs conference remotely. You may get a limited free ticket (50% of talks, no workshops) and join me by clicking this badge.

#react #reactjs

React Summit 2022

Nadia Makarevich

React Myths And Legends

React Summit 2023

How React Compiler Performs on Real Code

Get ready for an annual deep dive into the latest trends in React and Web development. Learn from engineers behind the framework ecosystem and early adopters at the main React Conference in the UK.The concept of the event is both about covering all you need to catch up on in the React ecosystem, combined with deep technical exploration of the latest architectural trends, new feature adoption, and efficient ways to solve complex problems.Engage in discussion rooms, hallway track with experts, hands-on practical workshops, and tens of insightful talks. Engineers of any level are welcome but be prepared for hardcore.

React Advanced

React Advanced 2024

The most talked-about news in the React community this year is probably the React Compiler. Everyone is looking forward to being saved from the re-render plague and never having to write useCallback/useMemo again. But are we truly there yet? Can the React Compiler actually achieve those things? Do we need to do anything other than turning it on and enjoying a re-render-free life? I ran it on a few real-world apps to find the answer. Want to see the results? In this talk, we’ll take a look at what the React Compiler is, what problems it solves, and how it performs on simple code examples and real-world applications.

The talks explore various misleading patterns and concepts in React, that seem to be “common knowledge”, but which a lot (if not most) developers either get wrong or are just not aware of those. Some examples, covered in the talk (and more): * that “react component re-renders when its props change” (this is not true) * that wrapping a component in React.memo will prevent its re-render (not always true) * that use of Context causes re-renders and is bad for performance (not always true, sometimes Context can actually reduce the number of re-renders in the app) * that creating an element like this `const A = &lt;Child /&gt;` is when the Child's render lifecycle is triggered (not true)

React is a fantastic tool to implement complicated applications fast, we all know it. But are they going to be fast when implemented fast? Let’s talk about re-renders and their danger in react: how easy it is to make a mistake, why some small mistakes can have a huge downstream effect, and how to avoid and prevent them.This is a deep-dive type of talk, that focuses on why React components re-render, what kind of performance impact it can have, and what to do about it