useDeferredValue

useDeferredValue() does the same thing as useTransition(), making a slow interface faster.

useDeferredValue() is useful when the value comes “from above” and you don't have control over the corresponding setState call.

If you do not have access to the state updating code (if a third-party library handles it), then you should use useDeferredValue() instead of useTransition().

useTransition() wraps the state updating code, whereas useDeferredValue() wraps a value affected by the state change.

Example

const deferredProducts = useDeferredValue(products);

{deferredProducts.map((product) => (<li>{product}</li>))}