Skip to content
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

Check if suspensey instance resolves in immediate task #26427

Merged
merged 1 commit into from
Mar 20, 2023

Commits on Mar 20, 2023

  1. Check if suspensey instance resolves in immediate task

    When rendering a suspensey resource that we haven't seen before, it may
    have loaded in the background while we were rendering. We should yield
    to the main thread to see if the load event fires in an immediate task.
    
    For example, if the resource for a link element has already loaded, its
    load event will fire in a task right after React yields to the main
    thread. Because the continuation task is not scheduled until right
    before React yields, the load event will ping React before it resumes.
    
    If this happens, we can resume rendering without showing a fallback.
    
    I don't think this matters much for images, because the `completed`
    property tells us whether the image has loaded, and we currently never
    block the main thread for more than 5ms at a time (for now — we might
    increase this in the future). It matters more for stylesheets because
    the only way to check if it has loaded is by listening for the
    load event.
    
    This is essentially the same trick that `use` does for userspace
    promises, but a bit simpler because we don't need to replay the host
    component's begin phase; the work-in-progress fiber already completed,
    so we can just continue onto the next sibling without any
    additional work.
    
    As part of this change, I split the `shouldSuspendCommit` host
    config method into separate `maySuspendCommit` and `preloadInstance`
    methods. Previously `shouldSuspendCommit` was used for both.
    
    This raised a question of whether we should preload resources during
    a synchronous render. My initial instinct was that we shouldn't,
    because we're going to synchronously block the main thread until the
    resource is inserted into the DOM, anyway. But I wonder if the browser
    is able to initiate the preload even while the main thread is blocked.
    It's probably a micro-optimization either way because most resources
    will be loaded during transitions, not urgent renders.
    acdlite committed Mar 20, 2023
    Configuration menu
    Copy the full SHA
    3fcd918 View commit details
    Browse the repository at this point in the history