There are 16 hooks in React 😏 😈 And I bet you never used this one: useSyncExternalStore() Used internally in state management libs, like Redux But have you ever thought about using it in your own app code? 💡 It could be useful & even prevent some React re-renders 👇 🧵
Let's start with a real-world problem. Imagine you are using React-Router and call useLocation() in a few places ➡️ do some conditional rendering depending on pathname, hash, ?search query-string...
@sebastienlorber Is it possible to use this to listen to one property of useContext(FooContext)?
@sebastienlorber Nice one Would love try this out Thanks 🙌🙂💯
@sebastienlorber @sebastienlorber can I get the source for how you did the render effects on the divs/borders and the little render div that fades?
@sebastienlorber This is gem 💎. I am glad I found your tweet. Recently i faced same issue in one of my custom hook and wanted to add same functionality where if only one field changes then I didn’t want to render other components where it was not listening to that same field.
@sebastienlorber My question is always when to sync with this, and when to use useEffect instead. In the React docs, both are used interchangeably.