react-use-state

Pass an updater function to the setter, such as setCount(c => c + 1), instead of referencing the state variable directly. This guarantees each update receives the latest queued value, which matters when multiple updates run in the same event handler.

Use useReducer when state has multiple related sub-values, when the next state depends on the previous one in complex ways, or when you want to centralize transition logic in a reducer function. useState fits simple, independent values.

State updates are asynchronous and batched by React, so reading the variable right after calling the setter returns the old snapshot. Compute the next value into a local variable if you need it immediately, or use useEffect to react to changes.

No. Values computable from props or other state should be calculated during render, or wrapped in useMemo if the computation is expensive. Storing derived values creates redundant state that can drift out of sync.

React detects changes by comparing object references, so mutating an existing object or array and passing it back to the setter is ignored. Always create a new object or array using spread syntax, map, or filter when updating state.