New React Hooks

useSyncExternalStore

It lets you subscribe to an external store. It returns the snapshot of the data in the store.

const snapshot = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot?);

1. The subscribe function should subscribe to the store and return a function that unsubscribes.
2. The getSnapshot function should read a snapshot of the data from the store.

Important

When possible, we recommend using built-in React state with useState and useReducer instead. The useSyncExternalStore API is mostly useful if you need to integrate with existing non-React code.

These following hooks are great for the perceived performance (mostly).

useTransition

useOptimistic

useDefferedValue

Sources

• [https://react.dev/reference/react/useSyncExternalStore]