Skip to content

It's confusing that useTransition doesn't do anything outside of user-blocking events #17279

@gaearon

Description

@gaearon
Collaborator

I ran into this when implementing Back button transition in a router. Because the transition is inside a browser popstate event, it gets batched with the low pri update, and the pending state doesn't appear.

I had to do this to work around it but it's unfortunate. We might want to fix this by treating pending state as special. Or maybe a warning — but then we need a first-class official API for opting into user blocking pri.

Activity

dai-shi

dai-shi commented on Nov 5, 2019

@dai-shi
Contributor

the transition is inside a browser popstate event

Ah, I see...

As useTransition doesn't do anything in useEffect, I assumed it's by design.
Is it a bad idea to run the entire callback in user blocking priority?

window.addEventListener('popstate', wrapCallbackWithUserBlockingPriority(handlePopState));
// or even something like ReactDOM.addEventListener('popstate', handlePopState)

I mean the question is only about useTransition, or any other issues suffer from low priority callbacks even if they are user initiated.

gaearon

gaearon commented on Nov 6, 2019

@gaearon
CollaboratorAuthor

You generally shouldn't run something with user-blocking priority unless it was actually initiated by user. Back Button is.

dai-shi

dai-shi commented on Nov 6, 2019

@dai-shi
Contributor

Is it only popstate that we want to raise the priority? It's such a special case then.

jihlstrom

jihlstrom commented on Nov 13, 2019

@jihlstrom

I have been playing around with concurrent mode and I'm impressed with how well the pieces fit together and easy it is to design complex transitions. Well done!

Regarding transitions, does it make sense to do a timeout on the initial render? and in case it does, how would I go about doing that?

gaearon

gaearon commented on Nov 15, 2019

@gaearon
CollaboratorAuthor

Closing as a duplicate of #17272

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @jihlstrom@dai-shi@gaearon

        Issue actions

          It's confusing that useTransition doesn't do anything outside of user-blocking events · Issue #17279 · facebook/react