Discover published sets by community

Runs synchronously after all DOM mutations. Example: useLayoutEffect(() => { measureLayout(); }, [dependencies]);

Memorizes a callback function. Example: const memoizedCallback = useCallback(() => { doSomething(a, b); }, [a, b]);

Memorizes the calculated value. Example: const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);

Used to access the state from an external, mutable source in a concurrent-safe way. Please note that this hook has been replaced by useSyncExternalStore in React 18.

Used to display a label for custom hooks in React DevTools. Example: useDebugValue(value);

Returns an object that is stable across server and client rendering, useful for generating unique IDs (deprecated, use useId instead).

Subscribes to an external mutable source. Example: const state = useSyncExternalStore(store.subscribe, store.getState);

Triggers a refresh of cached data if updates are detected (experimental and not a part of the stable API).

Returns a mutable ref object. Example: const myRef = useRef(initialValue);

Used to perform side effects in functional components. Example: useEffect(() => { document.title = `You clicked {count} times`;}, [count]);

Customizes the instance value that is exposed when using ref. Example: useImperativeHandle(ref, () => ({ focus: () => { inputRef.current.focus(); } }), [inputRef]);

Defers the value until after the next render. Example: const deferredValue = useDeferredValue(value);

Enables stable event callbacks, preventing capture of values, props, and state (experimental in React 18). Example: const stableOnClick = useEvent(() => { console.log('clicked'); });

Used to inject styles into the DOM before layout occurs. Example: useInsertionEffect(() => { const sheet = new CSSStyleSheet(); sheet.replaceSync('* { transition: none; }'); });

Allows you to add state to functional components. Example: const [count, setCount] = useState(0);

Gives you access to the data in React Context. Example: const value = useContext(MyContext);

Generates a unique and stable identifier. Example: const id = useId();

Helps optimize the rendering of non-urgent updates. Example: const [isPending, startTransition] = useTransition();

Used with React-Redux to efficiently select data from Redux store. Example: const data = useSelector(state => state.data);