-
Notifications
You must be signed in to change notification settings - Fork 46.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
React 18 Fallback not showing with useTransition after delay exceeds timeoutMs #22242
Comments
Yeah, we removed Haven't had a chance to update the docs because the update would need to be quite extensive, and we plan to remove those docs in favor of some new documentation before a stable release anyway. Hope this helps! |
Thanks for taking the time to reply and find the relevant PR! Was really helpful to see the thoughts behind it too. Is it still the case that you’re no longer immediately looking to solve the issue of loading spinners existing for a few milliseconds when loading new data? I suppose you could implement a similar effect user-land with a hook that takes a function that loads a resource, catches the thrown promises, returns old data for |
Yes. Broadly speaking, we could still introduce some heuristics deferring or throttling the spinners, but for now we’re not focusing on that problem. In the long term, we’d like to use animated transitions to avoid “flashes”, with Exit Animations allowing the fallback to leave gracefully instead of suddenly. reactjs/rfcs#154 (comment)
I wouldn’t suggest something like this. It sounds pretty complicated and probably breaks expectations in subtle ways. There are very specific rules about what Suspense implementations should do, and throwing Promises is only a part of that. We haven’t documented them in detail yet, but the tldr is that you should think of Suspense implementations as always being backed by some sort of a cache. The Promises you throw must be the same ones for the same content (not always new ones), they must be cached, and they most consistently be thrown (not dependent on timing) until they resolve. After they resolve the same value must consistently be returned until the cache gets replaced. (The mechanisms for this aren’t covered by a stable API yet.) That is to say — I wouldn’t recommend building anything that tries to “orchestrate” throwing Promises based on timing. |
How do I know the time spent in |
I've tried the latest version of React 18 (as of today), and made a very simple test bed for the new APIs.
I've got the full gist here - but for brevity, I've only copied the important bits below
From my understanding, if I click the
Load WITH Transition
button, I should see(Pending...)
in the button for a second, then theLoading...
should show for a second, then both loading states are cleared as the resource is loaded.However, I cannot get the fallback to show when using
useTransition
. If I don't use that - the fallback loads perfectly.Is this a bug, or am I misunderstanding how this works?
The text was updated successfully, but these errors were encountered: