Bug 294602

Summary: [WebGPU] Very poor texture upload performance when passing canvas
Product: WebKit Reporter: Ashley Gullen <ashley>
Component: WebGPUAssignee: Mike Wyrzykowski <mwyrzykowski>
Status: NEW    
Severity: Normal CC: gman, karlcow, mwyrzykowski, paul.neave, tzagallo, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari Technology Preview   
Hardware: Mac (Apple Silicon)   
OS: macOS 15   
Bug Depends on: 263692    
Bug Blocks: 267291    
Attachments:
Description Flags
webgl repo
none
webgpu repo
none
PoC none

Ashley Gullen
Reported 2025-06-17 03:11:26 PDT
Steps to reproduce: Visit repro URL and observe framerate: https://downloads.scirra.com/labs/textscaling/webgpu4/index.html NOTE: this issue requires WebGPU support to reproduce which is currently only enabled in pre-release channels. Check that WebGPU is logged to the browser console to verify. This reproduces for me in Safari TP 221. The repro URL renders text at lots of different scales by drawing text to canvas2d and then uploading that as a texture. This is a way to get high-quality text rendering in WebGPU as it does not have any direct way to render text. It's used by our web-based game engine Construct (www.construct.net). Actual results: The performance of doing this is extremely poor. The test runs at around 3 FPS on an M1 MacBook Pro. Expected results: On a high-end system this should be able to achieve a smooth 60 FPS. Indeed Chrome rendering with WebGL can achieve that. Safari's WebGL renderer is also slow doing the same thing (see WebGL test: https://downloads.scirra.com/labs/textscaling/webgl/index.html). It would be nice if it was fixed for WebGL too, but for the future the main thing we care about is that it's fast in WebGPU.
Attachments
webgl repo (11.41 KB, text/html)
2025-06-18 10:10 PDT, Gregg Tavares 		no flags
Details
webgpu repo (14.67 KB, text/html)
2025-06-18 10:10 PDT, Gregg Tavares 		no flags
Details
PoC (637.40 KB, image/png)
2025-10-28 09:27 PDT, Mike Wyrzykowski 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Mike Wyrzykowski
Comment 1 2025-06-17 08:06:43 PDT
Issue reproduces, however I observe ~5 fps on my Mac Studio using Chrome 139.0.7244.0 (Official Build) canary (arm64) so does not appear unique to WebKit
Mike Wyrzykowski
Comment 2 2025-06-17 08:08:19 PDT
Upload path between 2D canvas and WebGPU could certainly be improved.
Mike Wyrzykowski
Comment 3 2025-06-17 08:09:55 PDT
Right now we make a full read back of the IOSurface contents to the Web content process, copy (CPU side) to an array, send that back to the GPU process, and then upload that back to the GPU. In theory we should be able to skip the web content and CPU side part and use the 2D canvas directly in a MTLTexture without leaving the GPU process as these are all backed by IOSurfaces.
Radar WebKit Bug Importer
Comment 4 2025-06-17 08:10:10 PDT
<rdar://problem/153642354>
Ashley Gullen
Comment 5 2025-06-17 08:29:38 PDT
FWIW I filed a Chrome issue about this here as well: https://issues.chromium.org/issues/40273077 It looks like they have a fix in progress (although it is taking a while).
Gregg Tavares
Comment 6 2025-06-18 10:10:02 PDT
Created attachment 475601 [details] webgl repo a standalone webgl repo
Gregg Tavares
Comment 7 2025-06-18 10:10:32 PDT
Created attachment 475602 [details] webgpu repo a webgpu repo
Mike Wyrzykowski
Comment 8 2025-06-18 10:11:38 PDT
Thank you Gregg for the repros :)
Mike Wyrzykowski
Comment 9 2025-10-01 16:12:33 PDT
This should be resolved by https://bugs.webkit.org/show_bug.cgi?id=263692 but I hesitate to dupe it so we ensure it is fixed when https://bugs.webkit.org/show_bug.cgi?id=263692 is completed
Ashley Gullen
Comment 10 2025-10-03 07:58:55 PDT
FWIW I have an updated repro as we have made some changes to our WebGPU rendering code to try to handle this more efficiently: https://downloads.scirra.com/labs/textscaling/webgpu-batched/index.html It no longer generates mipmaps, and it also batches all texture uploads together to avoid creating render passes in between every texture upload. This still only gets about 5 FPS on macOS 26 for me though.
Mike Wyrzykowski
Comment 11 2025-10-28 09:27:18 PDT
Created attachment 477211 [details] PoC I have an initial implementation for this. 60fps now when Gregg's repro (thank you Gregg) Performance of the original site matches Chrome Canary on my Mac
Mike Wyrzykowski
Comment 12 2025-10-28 09:58:22 PDT
Pull request: https://github.com/WebKit/WebKit/pull/53089
Mike Wyrzykowski
Comment 13 2025-10-28 10:07:53 PDT
*** Bug 263692 has been marked as a duplicate of this bug. ***
Ashley Gullen
Comment 14 2025-11-26 09:20:42 PST
Here's an updated repro where we've further tried to optimize things on our side: https://downloads.scirra.com/labs/textscaling/webgpu-two-phase/index.html This now updates all canvases, before proceeding to upload all canvases to WebGPU textures with consecutive calls to copyExternalImageToTexture(). However it does not appear to have improved performance much in Safari 26.1.
Mike Wyrzykowski
Comment 15 2025-11-26 12:45:42 PST
My pull request has some potential for race conditions as I supported zero copies in image sources as well. We are also working to make copies faster between all sources and WebGL + 2d canvas. I can see if I can limit the PR to canvases so the race condition is only required to be addressed for that path
Note You need to log in before you can comment on or make changes to this bug.