Advanced React Interview QuestionsAdvancedConcept
React · Question 72
What does useTransition do in React?
Direct answer
useTransition lets a component mark selected state updates as non-blocking Transitions and exposes an isPending flag while that Transition is still in progress.
Tabs.jsx
function Tabs() {
const [tab, setTab] = useState("overview");
const [isPending, startTransition] = useTransition();
function selectTab(nextTab) {
startTransition(() => {
setTab(nextTab);
});
}
return (
<>
<TabButtons onSelect={selectTab} />
{isPending && <span>Updating…</span>}
<TabContent tab={tab} />
</>
);
}The update inside startTransition() is treated as non-urgent, so React can interrupt it to handle more urgent work such as typing or another interaction.