pmndrs / zustand

🐻 Bear necessities for state management in React
https://zustand-demo.pmnd.rs/
MIT License
48.35k stars 1.5k forks source link

Zombie children when using with react-three-fiber #356

Closed Tirzono closed 3 years ago

Tirzono commented 3 years ago

Steps to reproduce:

  1. Go to https://codesandbox.io/s/infallible-bouman-jns1g?file=/src/App.js
  2. Press Add
  3. Press the remove button

Note that the problem does not happen when you actually remove the "Scene" component, which gives me the feeling this is happening because of having multiple reconcilers.

I am not sure if this is a problem/bug in Zustand or in react-three-fiber, so please let me know if I should move this issue to react-three-fiber.

dai-shi commented 3 years ago

Just a quick note without looking at the repro: As batchedUpdate won't work for multiple renderers, would it be an unsolvable limitation?

Discussion: #286

Tirzono commented 3 years ago

Isn't there something we can do with the order of the listeners (based on the order of the renderers, if there's such a thing)?

I tried to Google a bit before creating the issue but couldn't find much about batched updates and multiple renderers.

Disclaimer: I don't know anything about how renderers work, so I might say nonsense.

dai-shi commented 3 years ago

I guess this is really an edge case. As far as I understand, the order of listeners doesn't help in a single renderer. It may matter for multiple renderers?

valtio may work as it delays one tick. https://codesandbox.io/s/awesome-https-ksj9e?file=/src/App.js looks good?

hm, how about delaying with zustand. https://codesandbox.io/s/patient-morning-vp99h?file=/src/App.js doesn't work...

waiting two more ticks seems to work. https://codesandbox.io/s/jovial-dust-mlyuq?file=/src/App.js

(now, i'm not sure why valtio worked.)

so, it seems this is about async scheduling, so ordering listeners doesn't help, because they are all sync.

dai-shi commented 3 years ago

Let me close this as not fixable...