Adding a second instance of Canvas increases render loop speed
See original GitHub issueHey all,
Thanks creating such a useful library.
I’m noticing some odd behavior when instantiating multiple Canvas objects. Any updates happening in useRender are performed twice as fast when the second canvas is added. Possibly the useRender callbacks are being called once for each renderer regardless of the renderer they should be attached to?
https://codesandbox.io/embed/react-three-fiber-multi-render-test-m3h2q
I’ve created a codesandbox reproducing the issue in it’s simplest form. After 5 seconds a second canvas is added and the first cube’s rotation speed increases for some reason.
As far as I can tell this issue started somewhere around v2.0.11, seemed to be working alright before that.
Thanks for all the help
Dex
Issue Analytics
- State:
- Created 4 years ago
- Reactions:1
- Comments:8 (3 by maintainers)
Top Results From Across the Web
Adding a second instance of Canvas increases render loop ...
I'm noticing some odd behavior when instantiating multiple Canvas objects. Any updates happening in useRender are performed twice as fast when ...
Read more >Optimize HTML5 canvas rendering with layering
To use the layer technique, you have to identify the HTML5 canvas elements the layering needs by finding the entities' rendering overlap.
Read more >Optimizing canvas - Web APIs | MDN
The element is one of the most widely used tools for rendering 2D graphics on the ... The following is a collection of...
Read more >Scaling performance - React Three Fiber Documentation
All you need to do is set the canvas frameloop prop to demand . It will render frames whenever it detects prop changes...
Read more >Is it asking too much of canvas to redraw everything inside of ...
First off: Yes, altering your code to only paint the sections that are changing may help lots, but you should always be testing...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

that doesn’t make any sense, so weird - looks like for some reason it calls the useRender twice. 🤯 will have to investigate a bit …
oh my … you’re right, that was a terrible oversight. the problem goes even deeper now, because it mutates that defaultRef, camera, scene and all. It’s a wonder it’s kind of working.
It should be fixed, but i had to fix the other parts as well (scene, cam, raycaster, etc) which all were equally affected, not just subscriber.