Why does React re-render so much and how do I actually control it?
I've been learning React for a few months and I'm still struggling with re-renders. I understand the basics of state and props, but my components seem to re-render way more often than I expect. For example, I have a parent component with some state, and when that state changes, every child re-renders even if the props haven't changed. I know about React.memo and useMemo and useCallback, but adding them everywhere feels wrong and messy. Is there a mental model I'm missing? How do experienced React devs think about preventing unnecessary renders without over-optimizing? I'm not trying to micro-optimize everything, but I've definitely hit performance issues in a medium-sized app. Should I just accept that re-renders are cheap or is my component structure the real problem? Any advice on building React apps that don't fight me on this would be great.