YOU MAY BE LOOKING FOR A USESYNCEXTERNALSTORE

Summary from the TLDR Web Dev newsletter

When you see a `useEffect` updating a `useState` with a subscription, you should consider using `useSyncExternalStore` instead. This pattern, while common, can cause jank because React renders the component multiple times. `useSyncExternalStore` provides a cleaner API, allows specifying a server-side default value, and reduces jank by making sure the correct value is used on the initial render.