Fixating on fixing rerenders 3 Minutes with Kent

https://kentcdodds.com/blog/fix-the-slow-render-before-you-fix-the-re-render
https://kentcdodds.com/blog/colocation
https://epicreact.dev/improve-the-performance-of-your-react-forms
Hello there friends. So today somebody shared a lightbri with me and I
assumed that it was just a library to help you track rerenders. But it
turns out it's like a state management library and that helps you avoid
rerenders but my initial reaction and thought about tracking re-renders is
the tools like that.
I think lead people to jump directly to the natural and obvious solution,
which is often not the best solution and I'm talking about memoization. So
when,If you're tracking rerenders and that's how you measure whether
something's faster or not you're gonna say, oh well this component didn't
need to rerender so therefore.
I will apply the re-render hammer to solve this problem and that is react
memo. And then you have to use memo or use callback all the things that you
pass to it. And that spiders in into the rest of your code base really
easily. And so what I recommend is I have a blog post called fix the slow
render before you fix the rerender and so you have to put a little bit more
thought into it, but you find out what part of you.
Here rendering is slow because even if you fix the rerender at some point
you've got to render like there are necessary renders. And if those are
slow then that's not a great user experience either. And so if you can fix
that then maybe you'll be able to avoid needing to worry about rerenders.
But sometimes you just there's nothing that's slow in particular. It's just
a lot of things that add up to make the experience slower and so fixing
renders is kind of the the best approach for that. And when you're in that
situation, then I actually wrote.Another blog post called state look
colocation can make your react apps faster and just recently wrote a blog
post that takes an angle on the like forms and how you can use state
collocation with forms and I'll link all of those at the top of this the
description this episode.
But basically, I think that we can get a lot by using state co-location
also composability and composing our components, especially like layout
components, so you don't have to pass.Props through all these other you
know app components And as with a combination of the way that you structure
things you often don't have to worry about unnecessary renders because they
just can't happen.
So anyway, the library itself was a state management tool and and some
people get a kick out of that and that's great. That's awesome. I haven't
found myself needing to reach for many state management tools outside of
react query and went with Remix. I don't really need a state management
tool.
It's pretty awesome. But yeah, those are just some of the thoughts that I
had when I first saw the name of this librarian. So hope that,Is
interesting and helpful have a nice day.