React Hooks Cheat Sheet/useSyncExternalStore subscribe to external state

Read and subscribe to an external store consistently.

Section: Performance and Concurrency Hooks

useSyncExternalStore subscribe to external state

tsx
tsx
const snapshot = useSyncExternalStore(store.subscribe, store.getSnapshot, store.getServerSnapshot);
Explanation

For libraries or app code integrating with non-React stores while preserving concurrent rendering correctness.

Learn the surrounding workflow

Compare similar commands or jump into common fixes when this command is part of a bigger troubleshooting path.

Related commands

Same sheet · prioritizing Performance and Concurrency Hooks
useMemo memoized derived value
Cache an expensive derived computation.
OpenIn sheettsxsame section
useCallback stable callback
Memoize a callback passed to children.
OpenIn sheettsxsame section
useTransition for non-urgent updates
Mark updates as transitions.
OpenIn sheettsxsame section
useDeferredValue delay expensive rendering
Defer a value so expensive children lag behind urgent input.
OpenIn sheettsxsame section
use API with context or promise
Read context or promise values with the `use` API.
OpenIn sheettsxsame section
useState basic state
Create local component state.
OpenIn sheettsx2 tag match