Email or username:

Password:

Forgot your password?
mcc

WebGPU, the new graphics API for JavaScript, shipped in a stable web browser (Chrome 113) about… an hour ago!

I have written a blog post about it, covering a brief (okay, not brief) history of graphics APIs to ~situate WebGPU in a context~, a brief general guide to writing WebGPU, and some specific resources for making WebGPU projects in TypeScript, Rust, and C++ (you can use it on desktop! it doesn't have to be in a browser).

I think WebGPU is really good.

cohost.org/mcc/post/1406157-i-

80 comments
Brion Vibber :blobcatcoffee:​

@mcc

i'm dead. i'm dying. this is *chef's kiss*

"Browser vendors, in that spurt of weird hubris that gave us the original WebAudio API, adapted OpenGL ES into JavaScript as "WebGL", which makes no sense because as mentioned OpenGL ES was all about packing bytes into arrays full of geometry and JavaScript doesn't have direct memory access or even integers, but they added packed binary arrays to the language and did it anyway."

mcc

@brion IT WAS KIND OF WEIRD IN MY OPINION

Brion Vibber :blobcatcoffee:​

@mcc

"WebGPU caters to the kind of person who thinks it might be fun to write their own raymarcher, without requiring every programmer to be the kind of person who thinks it would be fun to write their own implementation of malloc."

<3 <3 <3

pyro

@brion @mcc even as exactly the kind of weirdo who would find it interesting to write their own malloc, god do I despise how much you have to do in vulkan just to render a triangle

mcc

@pyro @brion I've implemented malloc! It wasn't really that interesting. I would be mildly annoyed if an API required me to do it again.

Now, implementing a linear allocator with compacting GC… THAT'S interesting. >_>

pyro

@mcc I ended up writing my own reference counted allocator for a virtual machine project several years ago now, and it was fun to learn with but *awful* performance-wise (which is probably to be expected). still, if I were to work on a project that required GC again, that sounds like a fun rabbit hole to get sucked into!

Dan Cassidy 🦌

@brion @mcc I'm pretty sure that Mozilla at least were already thinking about asm.js, which was later replaced by WebAssembly. They're pretty good at pushing the platform forward in ways that look like really weird choices when examined as piecemeal changes but make a lot of sense in the context of the whole.

Dan Cassidy 🦌

@brion @mcc Also FWIW there was precedent in ActionScript 3, which adopted a similar design for Molehill/Stage3D, and remember AS3 was going to form the basis of ES4 until Microsoft nixed it. And AS3 had a bytecode VM, which would have been included in browsers as part of ES4.
(In hindsight I'm glad we got ES6 and WebASM instead but that's where a lot of these things originate.)

Klara, continued

@mcc I didn't want to pollute your Cohost comments with this, but I like your choice of year-establishing images.

mcc

@klara Thank you very much. Did you notice how I used "The Force Awakens" and "The Rise of Skywalker" to illustrate the idea of something bursting onto the scene full of promise in 2016 but by 2019 it had just kind of become a widely-shunned failure

James Cash

@mcc would you mind if I submitted this to Lobsters? I think it would be the type of content they like, but I also very much understand if you don't want to show up there

mcc

@jamesnvc Sure, that's fine. I'm not familiar with lobsters but I know at least it's not HackerNews :)

James Cash

@mcc “At least we're not HackerNews" is basically their tag-line :p Thanks!

mcc

@felipe In fact my originally intended release time for this blog post was yesterday. So in fact, I'm so slow it makes me *look* quick! mastodon.social/@mcc/110296328

Brian Swetland

@mcc Interesting blog post!

I'm doubtful that WebGPU replace Vulkan in the sense that it adds a fair bit of overhead for the various safety checks, etc, and game engines, middleware, etc that are concerned about performance and/or access to the latest hardware features will want to avoid this abstraction.

I think it's more likely to replace OpenGL for software that wants a more modern GPU interface with a bit more safety, simplicity, and portability than Vulkan.

Brian Swetland

@mcc In particular, Vulkan just recently introduced Shader Objects which allow users to avoid the "have to build up entire pipelines at once" issue, more efficiently bind engines to GPU activity, mix and match shaders, and avoid some of the more expensive shader (re)compilation issues. WebGPU seems to be pretty firmly designed around the original Vulkan configure-the-whole-pipeline-at-once approach.

mcc

@swetland Could the safety validation in WebGPU be elided when running in performance-critical situations on desktop? In principle, if not currently.

Brian Swetland

@mcc It sounded like that could be doable and I thiiink one of the implementations has a performance mode that does something like that.

It's still an adapter layer on top of Vulkan (or a comparable lower level API), and at least the Chrome library for it looked pretty hefty at a glance. My suspicion is that big game engines, etc, would not see value in adding a simplifying layer that is more restrictive.

For smaller apps, portability and simplicity could outweigh a bit of overhead.

Brian Swetland

@mcc Of course if your goal is "run in browsers", it's a win, and if you want to run in browsers and elsewhere and are not looking for getting that last couple percent of performance and don't need the latest shiny API/extension-wise, it's pretty appealing to adopt as your GPU abstraction.

I just don't think it's likely to replace Vulkan for most engine/middleware use.

phooky

@mcc Thanks! This is such an excellent writeup. I'm going to have to give it a whirl!

Noelle

@mcc I'm not a graphics programmer (the furthest I've gotten is software rendering with Canvas2D), but I found this to be an approachable and fun history lesson! Thank you for putting all that together @mcc !

David Neto

@mcc

This is excellent. Took three sittings for me to read it but it was worth it!

You're a good writer. 😃

bob

@mcc thinking about compiling rust to spir-v is making me nostalgic about haxe/hxsl (compiling shaders for flash :) )

Rylie ✨💖 Pavlik

@mcc as someone rather involved in Khronos I feel a little called out 🤣 but honestly I can't say any of the history stuff is wrong. Anyway OpenXR is clearly lacking any of the weaknesses alluded to in opengl and Vulkan. 😉 (Honestly if anything we don't cater to the game engines enough, and then game engines mangle or at least hide our beautiful APIs...)

Rylie ✨💖 Pavlik

@mcc I will point out that everybody involved in these standardization efforts seems to be doing it for the right reasons: it's mostly engineers, not managers, and the collaboration is really kinda magical feeling, at least in OpenXR. It's been really rewarding to be involved in standardization efforts. And we're all making the best decisions we can at the time with the data available, and with the limited political capital we each have. (I can't die on every API hill)

Rylie ✨💖 Pavlik

@mcc I assume you know this of course, but perhaps your readers might not. Really nice summary, though. It's quite comprehensive. I'll have to try webgpu sometime, since I know the other graphics APIs approximately equally badly. (I can import and export textures, etc from all of them, but actually rendering is more of a mixed bag)

Aras Pranckevičius

@mcc hey if it came out an hour ago, does it already have your “you made a mistake, it’s too late to fix it” library design bits somewhere there? :P

mcc

@aras See footnote (as well as replies both here and on Cohost) about pipelines vs shader objects :(

Aras Pranckevičius

@mcc the bit of history about "big engines" enthusiastically embracing vulkan/dx12 looks like that from the outside, but at least for Unity it was almost completely the opposite internally. The whole engine around year 2014 was *completely* unsuited for vulkan/dx12/metal design (and still largely is today), given that most of renderer design was still based around OpenGL 2.0 / DX9 concepts. So how come you end up with APIs like Vulkan, with engine vendors on Khronos? "It's complicated" :/

Aras Pranckevičius

@mcc Khronos discussions are basically *a lot* of conference calls and occasional face to face meetings, a lot of "voting" and tracking "who can vote" based on attendance, and a lot of writing proposals in weird dialect of English that is "spec language". Who wants to do that, and who has time to do that?

One possible, I'm sure hypothetical scenario: someone who's not terribly busy working on the engine itself. Heck, maybe if they spent their time on calls they'd cause less damage to the code!

Aras Pranckevičius

@mcc (this is 900% exaggerated, but there's a grain of truth)

And so you *can* end up in a situation where company's representatives on Khronos do not *necessarily* voice company's opinions or wishes. They are just *there*, saying whatever they want to say; they aren't quite aware of what the engine needs or wants, and vice versa the engine is not quite aware of what they are saying. A gross oversight from "management" I guess.

Aras Pranckevičius

@mcc And then you also get nuggets like company CEO going onto google IO keynote and promising the engine will ship Vulkan support in "like 3 months", and that's *totally news* to people working on the engine since everyone there is "it's gonna take 3 years to get into a design that suits vulkan". Why would a CEO do that? Because another engine did it, and it's a pissing match between CEOs or something.

Aras Pranckevičius

@mcc and then you mix in some pride and hubris and arrogance, like "hey all the cool kids are doing this mantle-like renderer design, who are we to not able to pull this off?", and you start nodding along at the conferences and proudly saying how it's all gonna be cool & cozy.

Tom Forsyth

@aras @mcc My recollections are that it was:

ISVs: we hate that drivers are doing all this stuff behind our backs.

IHVs: well we have to if the API is going to be usable.

ISVs: how about if we do all that work instead?

IHVs: ooooh - be careful what you wish for. I mean here's Mantle, look at all that crap you have to do.

ISVs: that looks awesome - we're software people, we can handle it.

IHVs: <washes hands> Ctrl+H, "mt", "vk", <yes to all>

Aras Pranckevičius

@TomF @mcc Right yeah, and my point is that this "ISVs" is an extremely small subset of "all ISVs", the ones who either really want it, or the ones who think they want it, but their opinion does not even reflect their company's or their coworkers' opinion.

Scott Michaud

@TomF @aras @mcc Also, from my (outside) perspective, it looked like NVIDIA was pouring money into driver optimizations. AMD was getting frustrated that Microsoft was (apparently) completely uninterested in updating DX11, and they couldn't keep up with NVIDIA's "Game Ready" treadmill, so they pushed Mantle (likely intending to donate it from the get-go).

(Roy Taylor saying no DX12 ~5-6 months before Mantle was announced)
megaleecher.net/directx_12

@TomF @aras @mcc Also, from my (outside) perspective, it looked like NVIDIA was pouring money into driver optimizations. AMD was getting frustrated that Microsoft was (apparently) completely uninterested in updating DX11, and they couldn't keep up with NVIDIA's "Game Ready" treadmill, so they pushed Mantle (likely intending to donate it from the get-go).

aeva

@mcc I'm not sure which is worse news, that it's out now or that it's actually supposedly good *sigh*

David Wilson

@mcc excellent article, thanks a lot for the deep dive!

Yet Another Mowgli

@mcc Exceptionally well written and the history was highly entertaining. I'll have to try out the rust examples now and commit to learning the shader language! Thanks for this!

Dekkzz

@mcc

at least its not controlled by google

Oro "it's flatpak time" 🏳️‍🌈

@MadMike77 @mcc yes, hashtags matter! I wouldn't have found this post if you didn't post the hashtags ;)

Nick Lockwood

@mcc this is very good. Thanks for writing it!

slembcke

@mcc Oh man! The Vulkan docs are one of the reasons I like it. They are so precise and complete I’ve written stuff after reading nothing but them! *Never* had that experience with GL, maybe with Metal. What Linux devices have you used that don’t run Vulkan? I think the older Pis or the old $150 netbook I had were the only exceptions I’ve run into.

mcc

@slembcke Well, see my post on Cohost about Pine64. The problem comes if you want to work with anything "Open Hardware" adjacent, or with a distro that has a pure open source stack, bc the problem is on some GPUs you can only get closed source Vk drivers. Which is not the same thing as *not supported*. But if the OS/hardware vendor is pure OSS, & so they ship GL drivers only outside ATI, then suddenly congrats if u install the Mali blob u just volunteered to be the QA dept

mcc

@slembcke Also not sure how closed source drivers only is going to work on a RISCV device. Nobody seems to have got.far enough with a RISCV laptop to have a coherent story about what GPU they're using, but then again, maybe if the driver situation was better that wouldn't be the case.

mcc

@slembcke Anyway, I agree the Vulkan documentation is extremely precise. But I tried to implement the ray tracing extensions (whose interface is… a little baroque) from the docs alone and it just broke me

Dan Cassidy 🦌

@mcc this is a *really* good article, thanks for writing it.

Beatrix

@mcc looks like i successfully postponed writing an engine using Vulkan until i can actually just try webgpu instead

Dag Ågren ↙︎↙︎↙︎

@mcc This seems about as correct as it is possible for a human to write an article like this. I think you just about got everything in there! Well done.

Two additions:

1. I've used Metal a lot, and WebGPU is definitely similar, with perhaps a few small extra warts that Metal handles a bit more smoothly. But for cross-platform availability, the small price is well worth it.
2. For native C or C++, you can also use wgpu just fine: Just use cargo to build a .a, and link that.

Dag Ågren ↙︎↙︎↙︎

@mcc Oh, also, I also prefer referencing uniforms and buffers by numbers rather than names, because it feels a lot more like an API contract that way. It means you can name things whatever you want in the shader, and still adhere to a strict contract with the rest of the code.

mcc

@WAHa_06x36 It's okay if I get linked on Orange Website, I understand that's a thing that happens. However, after what happened last time, I'm not reading the comments.

Dag Ågren ↙︎↙︎↙︎

@mcc I did, and there were some that were bad enough to be truly funny. Now you know so no need to look.

Millie

@mcc I've used a chunk of this outside of its usual context, WGPU as a native library import in Rust. It's pretty neat!

hikari 🌟

@mcc this is great and I think you managed to represent history close enough to the truth that you won't piss off anyone with deep knowledge of it (judging from my reaction, at least)

Jordan

@mcc This blog post is very good, thank you for writing it!

Advanced Persistent Teapot

@mcc "WebGPU caters to the kind of person who thinks it might be fun to write their own raymarcher, without requiring every programmer to be the kind of person who thinks it would be fun to write their own implementation of `malloc`."

I actually laughed out loud

Vlad

@mcc Your post really helped me understand a few things I had been confused about for a while, thank you very much!!! :)

vladmihaisima

@mcc Great history of the API-s, brings back some memories (not doing 3D anymore..)! And now I have another great example why I switched from disliking Microsoft in the 90s to disliking Apple...

✪ⓗⓞⓛⓞ✪
@mcc this was pleasing to read, as a smooth brain non coder I like to learn about this stuff.
Adador

@mcc thank you! I read it and I thought it was great :)

Chris Adams

@mcc I don’t think details will come out publicly but I want the inside scoop for what happened on WebKit shipping WebGPU behind a flag in 2019 but then pulling it a year or so later. I’m guessing someone had an unfun 2022 trying to get that back on track.

mcc

@acdha 2019 WebGPU was extremely incompatible with 2023 WebGPU tho

Chris Adams

@mcc a little searching also suggests that they had a fair amount of work moving from the first in-process design, which could certainly explain it. Just feels surprisingly under-staffed given all of the other things they shipped.

Lucky Zelle ✨

@mcc this is a wonderful little write-up and i'm really excited to see where things go with WebGPU! i might have to finally join the NPM hivemind ;_;

A Bitwise

@mcc Great write-up. Even the footnotes are worth reading!

“Wait, do JS modules/import just work in browsers now? I don't even know lol”

(I had the same exact response about a month ago)

Rony :vepi:

@mcc amazing article, thanks for sharing what you know

mak

@mcc Thank you for this article. It was fun to read and contains so many helpful details!

ChukG

@mcc great blog post -- I remember most of those graphics APIs from when they came out but it was helpful to see them all explained at once together (also I didn't know about WebGPU yet)

Thomas Dickerson

@mcc as someone who is still running Mojave on a 2013 MBP with discrete Nvidia card, this whole blogpost hits home.

Go Up