Thoughts on canvas2D->WebGL transfer of 4K buffer on M2 being 60x slower than copy of 4K buffer to Metal texture?

[Colin Blundell]

Hi folks,

Trujy and Mike (CC'd) reached out with an interesting finding:

"In our tests, copying content of 4K Canvas2D to WebGL texture takes around 20ms. This seems too slow. Due to the high memory bandwidth of M2 chips, the hardware limit of doing such a copy on our MacBooks is 0.17ms (100x faster than what we are seeing in practice).

So in theory, the copy should be possible to execute 100x faster.

When we tested this in native app (using Metal), the transfer of the 4K pixel buffer to a Metal texture took around 0.35ms, which is just 2x slower than the theoretical limit.

We don't precisely understand what is the cause of the 50x performance difference between doing the 4K transfer in Chrome (20ms) vs. doing it on native (0.35ms), so we're wondering if we are doing something wrong. Maybe with the right setup of the Canvas2D and WebGL context, the transfer can actually be much faster?"

Trujy filed a bug (with a trace attached on the bug) and made a repro case.

Does this finding intuitively make sense to people, or is it surprising as it was to me? We have been bringing up zero-copy transfer from canvas to WebGPU, but this finding seems to indicate that something drastic is going on beyond the inherent cost of the copy. e.g., if it's the synchronization necessary to flush the canvas that is causing the 60x slowdown, that synchronization will still need to occur even with zero-copy transfer.

Thanks,

Colin 

[Ken Russell]

Hi Colin, all,

It's not expected behavior, especially since things start out running fast (120 FPS on my M1 MacBook Pro). The bug's probably the best centralized place for more discussion and updates.

-Ken

[Colin Blundell]

Thank you for taking a look and confirming my intuition that this result is unexpected, Ken! Will continue discussion on the bug.

[Justin Novosad]

Have you verified that the WebGPU backing is properly recycling textures, as opposed to re-allocating new ones at each animation frame? For the 2D canvas, this should not be an issue since that canvas is not in the DOM so it's backing will never be sent to the compositor (which would trigger a backing swap and possibly a copy on write). Nonetheless it might still be worth making sure that there are no CanvasResource swaps happening with the 2d canvas's instance of CanvasResourceProvider, just in case there's bug there (e.g. texture copy interfering by holding a ref or something like that).

[Colin Blundell]

Thanks, Justin - will have that in mind to check!

[Sunny Sachanandani]

I posted a reply on the bug, but I'll provide an update here too: the issue is that the page is mutating the canvas current path using `rect()` every frame without ever closing the path. This causes vertex buffers to grow arbitrarily large and causes Metal command encoding time to go up. The fix is to either call `closePath()` or change the `rect()` + `fill()` to a `fillRect` like here.

[Colin Blundell]

On Wed, Feb 19, 2025 at 3:52 AM Sunny Sachanandani <sun...@chromium.org> wrote:

I posted a reply on the bug, but I'll provide an update here too: the issue is that the page is mutating the canvas current path using `rect()` every frame without ever closing the path. This causes vertex buffers to grow arbitrarily large and causes Metal command encoding time to go up. The fix is to either call `closePath()` or change the `rect()` + `fill()` to a `fillRect` like here.

Awesome investigation - thanks, Sunny! +Trujy Trujillo Mata +Mike Antonic Does this answer your question?

Best,

Colin

[Justin Novosad]

Oh geez, we've seen this before.  I once argued that the closePath should be implicit, but that idea was rejected because it would break backward compat and interop.

--

Justin Novosad - The Browser Company of New York

[Francisco Javier Trujillo Mata]

Hi there!
Thanks for the workaround, I will check if it solves our issues.

I will keep you updated!
Cheers

[Ken Russell]

Wow, thank you Sunny for tracking that down!

[Francisco Javier Trujillo Mata]

Hi there!
I have been doing some tests around, and I think that transferring the 4k texture is still slower than it should be.

I have attached the reports from Performance and Tracing, to see if they help you.

Cheers.

[Francisco Javier Trujillo Mata]

Hello again!

I am not sure if it is just me or if something has changed, but I'm not able anymore to see the messages from https://issues.chromium.org/issues/395520105

Could be possible that something about grants/permissions has changed? I'm just able to see my messages, not the other's messages.

Sorry for the noise!

Cheers

[Colin Blundell]

On Tue, Feb 25, 2025 at 8:59 AM Francisco Javier Trujillo Mata <fjt...@gmail.com> wrote:

Hello again!

I am not sure if it is just me or if something has changed, but I'm not able anymore to see the messages from https://issues.chromium.org/issues/395520105

Could be possible that something about grants/permissions has changed? I'm just able to see my messages, not the other's messages.

Are you sure that you're logged in to the right account? The account that you created the bug with is fran...@goodnotesapp.com, but the email that you sent right now (i.e. the one I'm responding to now) came from fjt...@gmail.com.

Best,

Colin

[Colin Blundell]

I actually don't know - the access to the bug looks like you should indeed be able to see all the comments. Does anyone else see anything wrt the configuration of the bug?

On Tue, Feb 25, 2025 at 9:24 AM Trujy Trujillo Mata <fran...@goodnotesapp.com> wrote:

Yeah, sorry that was a mistake to write here with my personal account, let me switch to the company one.

I have double-checked it, and yes I was using the proper account "fran...@goodnotesapp.com" in the https://issues.chromium.org/issues/395520105, and that's why I can see my previous messages, If I swap to my personal one I can't see any of them...

As you can see in the next screenshots my comments are visible, however, I know that 2 more comments were added because I received them by email, however, I don't see them in the thread, and I don't see either the previous messages.

Best,

Trujy

www.goodnotes.com

Don’t print, go paperless with Goodnotes!

Only the intended recipient named in the body of the email may rely on its contents. This email, including its contents and attachments, is confidential. If you have received it in error, please immediately notify the sender and permanently and securely delete it. Do not use, reproduce or disclose it in any way.

[Trujy Trujillo Mata]

Yeah, sorry that was a mistake to write here with my personal account, let me switch to the company one.

I have double-checked it, and yes I was using the proper account "fran...@goodnotesapp.com" in the https://issues.chromium.org/issues/395520105, and that's why I can see my previous messages, If I swap to my personal one I can't see any of them...

As you can see in the next screenshots my comments are visible, however, I know that 2 more comments were added because I received them by email, however, I don't see them in the thread, and I don't see either the previous messages.

Best,

Trujy

On Tuesday, February 25, 2025 at 9:12:50 AM UTC+1 Colin Blundell wrote:

[Kai Ninomiya]

What are the missing comments? I can't see any more comments, even on internal buganizer (which I think should show all possible info), than I can see when logged out in incognito mode.

Maybe there was a temporary issue?

-Kai (he/they)

[Trujy Trujillo Mata]

Hi there!

I'm seeing again all the comments, so most probably it was a temporal issue.

Cheers.