Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

useTransition can make an update non-blocking and expose whether its Action is still pending, but it does not make every update after an await part of the same Transition—and it does not ensure overlapping requests finish in the order they started. Those are two separate problems that can look like one: pending-state confusion and stale results.

The exact reproduction behind the original “second bug” framing is not established here. React’s documentation explains the supported behavior; GitHub issues document particular reports, not guarantees about every React 19 release.

What useTransition does—and what pending means

useTransition returns an isPending flag and a startTransition function. Calling startTransition marks state updates as non-blocking Transitions, allowing urgent updates—such as typing—to remain responsive while React works on the transition. In the current reference, pending remains true until the Actions complete and the final state is shown. React’s useTransition reference

That status answers whether React is still working through the Transition. It does not, on its own, tell you whether an async result belongs to the latest input or whether overlapping requests have settled in a useful order.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Why an update after await may not be a Transition

A common surprise is that marking an async Action with startTransition does not automatically mark state updates after an await as Transitions. React documents this as a limitation. If the post-await update should be transition-marked, wrap that update in another call to startTransition. React’s useTransition reference

startTransition(async () => {
  const result = await loadData();

  startTransition(() => {
    setData(result);
  });
});

This addresses the transition scope of the state update. It does not decide whether result is still the right result to display. That is a separate question whenever multiple operations can overlap.

Why correct Transition marking cannot prevent stale results

Network work can finish in a different order from the order it started. For example, a user types “a” and then “ab.” The request for “ab” may finish first, followed by the older request for “a.” If the application accepts both responses without checking which one is current, the input can show “ab” while the results show the response for “a.”

  1. Input changes to “a”; request A starts.
  2. Input changes to “ab”; request AB starts.
  3. Request AB resolves and its results appear.
  4. Request A resolves later and overwrites them with stale results.

This ordering problem is not fixed just by placing a state update in a Transition. The application needs to prevent an obsolete result from replacing the current one—for example, by associating each request with the input or a sequence identifier and only applying a response if it still matches the latest request. Whether you also use a Transition depends on how you want React to schedule the resulting UI update.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

The official documentation discusses out-of-order updates, and a repository issue illustrates the “ab” input with results for “a” scenario. That issue is a report tied to its reproduction, not a guarantee that every implementation behaves identically. React’s useTransition reference · React issue #28914

When pending stays true: a specific Suspense report

A separate React repository report, issue #28923, was opened April 26, 2024. Its reproduction involved a promise in state, use() under Suspense, and a parent update started inside a Transition. The reporter observed isPending become true but not return to false after completion. React issue #28923

The issue is closed and links to issue #29670. The available issue record does not establish the final fix or affected release range, so this report should not be treated as proof of a general React 19 pending-state bug—or identified as the same “second bug” without matching the actual code and reproduction. React’s use reference explains how promises are read in components, including with Suspense. React’s use reference

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Which React API fits the interaction?

React 19 introduced Actions and related APIs including useOptimistic and useActionState. They address different interaction shapes; none is a universal cure for async ordering or pending-state surprises. React 19 announcement, December 5, 2024

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Interaction Relevant choice What to keep in mind
Manually initiated work that needs a pending flag or a non-blocking UI update useTransition Use the pending state for the Transition, and explicitly mark post-await updates when needed. Protect against stale results separately.
A form-driven Action React 19 Actions and useActionState Choose based on the form workflow rather than treating the hook as a general request-ordering mechanism.
An update that should show an optimistic value before the final result useOptimistic It addresses optimistic UI; it does not establish which of multiple async responses is newest.
A promise read with use() under Suspense use() and Suspense behavior For a pending-state symptom, compare the code with the specific issue reproduction; the report does not establish a release-wide limitation.

A practical debugging sequence

  1. Find the update that sets the visible state. Check whether it happens before or after an await. If it happens after, wrap it in another startTransition when it should be transition-marked.
  2. Separate React scheduling from request correctness. If requests can overlap, trace their start and completion order. Ensure an older response cannot overwrite state for newer input.
  3. Trace the pending flag through the full interaction. Note when it becomes true, when each Action or promise settles, and when the final UI appears. If the code uses a promise in state with use() under Suspense, compare it with the exact ingredients in issue #28923 rather than generalizing from the report.
  4. Choose the API from the workflow. Use useTransition for manually initiated transition work and its pending state; consider useActionState for a form Action or useOptimistic for optimistic presentation.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.