Two.js: SVG/canvas faster than WebGL for scaling?

[anderspitman]

Hi there,

When playing with the particle sandbox, I noticed that WebGL is faster when it comes to number of vertices and rotation/translation, but both SVG and canvas are way faster if you enable scaling. I feel like I read something about this once but haven't been able to find it. Is it something to do with the design of two.js, or the way WebGL works, or something else?

[jonobr1]

It's the way Two.js is currently designed. The WebGL renderer for certain settings ( scale included` ) the renderer creates a new texture to send to the GPU. Pretty much position and rotation are the only ones that don't. There is a way to disable texture uploading on scale though. The reason this is not set by default is because it can create really low resolution looking objects in the scene. Hope this helps!

[jonobr1]

That being said.., I'm totally up for doing the rendering in WebGL differently if there is a good approach someone would like to point me to 🥇

[anderspitman]

Awesome, thanks for the explanation.

[jonobr1]

No problem. I'm working on entirely new documentation, so hopefully this type of information is more easily accessible. Thanks again for posting your question!