source code and online ide: https://codesandbox.io/s/react-three-fiber-untitled-game-i2160
this was a project i started just to see if i can pull it off. i didn’t get that far, still missing lots of basic things like collision detection but it serves as a nice example on how to combine react and three, and how well they can get along.
everything in it is a (mostly) self contained component, if you browse through index.js you can try taking components out, nothing should break. react takes care of managing the scene graph, it mounts/unmount objects, while threejs renders. individual objects can control their own render-phase via the useFrame hook. it doesn’t create that kind of salad where everything’s mixed and intermingled.
next step would have been to make objects truly self-contained, where they control their own collision detection, explosion, mount/unmount. but haven’t had the time - so sadly the central store is still controlling things it shouldn’t touch.