pmndrs/suspend-react

Fallback to previous render

Opened this issue · 1 comments

Cyral commented

This might not be something this library can handle but I would appreciate any advice. I'm hoping to fallback to the previously rendered HTML rather than a fallback component, basically doing nothing until the async code has completed.

I realize React 18 has startTransition which can wait for the state to load, but it involves calling setState and starting a new render, which adds a frame to the rendering process as far as I am aware. I want to pause the rendering until the async code is complete, then finish it, without flickering to a fallback component.

For some more context, I have a webworker operation that runs a bunch of calculations in parallel in response to user input. It only takes 2-3ms, so I want to just pause the rendering and wait for this to complete. If I do the calculations with useLayoutEffect and setState, I will end up waiting for react to render the next frame which adds additional lag.

you can do that with starttransition. for instance here https://twitter.com/0xca0a/status/1350214749296996353 i use it to retain the current state. it's still interactive because i wanted it like that, i only show "pending" in the ui, but it could as well freeze the screen, how you interpret pending is up to you.