useSyncExternalStore: Safely Read from External State
useSyncExternalStore lets your React components safely subscribe to data outside of React's state. Use it to connect to state libraries like Zustand or browser APIs. The main footgun: your `getSnapshot` function must return an immutable, cached value.
useSyncExternalStore is React's official way to subscribe to external data, preventing UI "tearing" where components show different state versions. It's the engine for libraries like Redux and Zustand, but you can also use it directly for browser APIs like `window.matchMedia`. The critical footgun is `getSnapshot`: it must return an immutable, cached value. Creating a new object on every call will trigger performance-killing re-renders.
Read the original → react.dev
- #react
- #hooks
- #state management
- #concurrency
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.