-
-
Notifications
You must be signed in to change notification settings - Fork 451
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Why is Webgl slower than Canvas? #672
Comments
Great question. The way the WebGL renderer works is by uploading 2D canvas textures and arranging them in GL space. Since this particular demo is changing the core shape in frame, the renderer needs to re-upload a new canvas texture for each part. Generally speaking, when you change the style (e.g: Hope this answered your question, |
I assume it is done this way for reasons of consistency, but there is so much potential with WebGL. I tried out the particle sandbox, and I too think canvas 2d is definitely faster, and gives a more crisp image. Do you think there's a chance that the web gl renderer gets re done at some time and made to be better optimized and possibly even given shader support? |
Yes, it's certainly on my radar to do. I've been experimenting over the years with a Signed Distance Field way to render all the shapes in Two.js, but haven't come to a final API yet. In the meantime, you can definitely modify the base shader as explained in these issues: |
I was playing around with your example here: https://codepen.io/jonobr1/pen/QWZZEQ
And was surprised that switching to "Two.Types.webgl" performed significantly worse.
I tried updating to the latest (which fixed the graphical issues), but the performance is still pretty slow compared to Canvas.
https://codepen.io/tylandercasper/pen/JjZLMeP
Curious as to why this is.
Thanks
The text was updated successfully, but these errors were encountered: