Rewrite to work with React's Concurrent Suspense mode about react-three-lightmap

[drcmda]

i think the only difference is that it's not a race. all components unsuspend at the same time

given:

<Suspense ...>
  <Async1 />
  <Async2 />
  <Sync />

previously: sync just fires stupidly, then async 1 and 2 depending on who's first

now: async1, async2, sync all fire at the same time as they should, when every thing inside has lifted the suspense.

this can later be controlled by the user via suspenselist (race, one after the other, all in sync).

how's the project going btw, would love to try it out again :)

[unframework]

Yeah, the blocking/concurrent mode is in some ways easier to think about that way. The only tricky part is that I'd like to keep the following logic:

• core scene suspends (e.g. loading gltf/etc)
• core scene is finished, unsuspends
• lightmapper wakes up, grabs a reference to core scene object and suspends again
• lightmapper is finished, unsuspends

The issue is that from a container component's perspective, the above will result in a short "blip" between step 2 and 3 (when things are unsuspended by core scene but not yet suspended by lightmapper). Sort of like a FOUC.

And the lightmapper can of course e.g. hide the not-yet-lit scene during the blip, sure, but I just don't like that this will result in the fallback spinner animation being reset for the overall suspense wrapper.

On the other hand, if I understand correctly, suspense wrapper can have a debounce on loading state? So maybe at least it won't unmount/remount loader instance during that "blip".

[drcmda]

you can probably resolve that by using useEffect and useLayoutEffect, the latter comes before the actual render on screen.

[unframework]

So here is a test sandbox: https://codesandbox.io/s/divine-firefly-rh2mx?file=/src/App.js.

I used useLayoutEffect to make sure that the "blip" is instantaneous, so at least there is no flash of unstyled content.

BUT. The loader gets re-instantiated - you'll notice how "loader instance" number changes during processing, at the moment that the content finishes loading. This might just look weird/cause spinner animation reset/etc. Not sure how to debounce that.

[unframework]

(also, I am still wrapping my head around why the zero-dependency effects seem to run multiple times instead of just once, will need to read newer docs)

[drcmda]

suspense unmounts the effects. i think only useEffect is left standing. i dont quite understand what the goal is for the sandbox.

[unframework]

suspense unmounts the effects. i think only useEffect is left standing. i dont quite understand what the goal is for the sandbox.

The sandbox demonstrates how lightmapper can wait for suspended content and then also suspend while doing lightmapping.

But the problem is that inbetween the two suspended phases the fallback loader gets re-created which would reset any e.g. spinner animation. I would like to find a way to avoid that re-creation/reset, it creates unsightly jank.

[unframework]

Fixed in #16.