react-three-renderer-example
react-three-renderer-example copied to clipboard
React slower than Direct update?
Guess I am confused and maybe misinformed, but how is http://toxicfork.github.io/react-three-renderer-example/#/benchmarks_rotating_cubes_react slower (considerably less FPS running at 3000 cubes) than the direct update example? I am assuming "direct update" means manipulating the DOM directly instead of leveraging React's virtual DOM (which I figured would be more performant)?
Well, it's probably more like I am confused, but what is direct update doing exactly? Just the difference between directly extending the cube component vs running the ExampleBase component? Because it seems both examples are using React, so my initial assumption of what "direct" meant seems to be wrong.
From the direct update js, its updateGraphic function is different. It updates the DOM directly.
I had sent an email response but it seems github had missed it... Direct updates version uses react only to build the scene for the initial render, but for the updates it modifies the objects without going through React, which will be faster without doubt. Once react becomes even more performant we will see the gap decrease, but there may always be some sort of overhead for cases like these.
And instead of the dom it's threejs objects :)