All Articles
CategoryFull-Stack
Reading Time
12 min read
Published
2025-12-04
Word Count
3,004words

Grab a coffee — this one is a deep dive!

Is WebGPU Production-Ready? Platform Status After Safari 26

Summary

WebGPU browser support for production is reviewed platform by platform as of December 4, 2025: full support on iOS Safari, desktop Safari only on macOS Tahoe, Firefox only on Windows.

  • iOS Safari has had full, flag-free WebGPU support since 26.0; desktop Safari is default-on only on macOS 26 Tahoe, with partial support elsewhere (caniuse note #7).
  • Chrome, Edge, and Opera have supported WebGPU by default since Chrome 113 (2023) — years ahead of Safari's desktop support.
  • As of December 4, 2025, WebGPU on Firefox is default-on on Windows (plus macOS 26 Tahoe/Apple Silicon from 145+); Linux and older macOS need `dom.webgpu.enabled`, and a WebGL fallback is required in production.
  • Update (September 2026): Safari 27.0 (September 17, 2026) added the clip_distances WGSL built-in; desktop Safari's overall support status hadn't changed as of September 2026.
Is WebGPU Production-Ready? Platform Status After Safari 26

If you're asking whether WebGPU browser support is good enough for production or still experimental, the short answer is: it depends on the platform. With Safari 26, Apple's ecosystem officially turned WebGPU on; Chrome and Edge have supported it by default for years; Firefox is default-on only on specific platforms. In this post I walk through the real support table as of December 4, 2025, the architectural difference from WebGL, a first compute shader example, and when you shouldn't trust WebGPU yet — all sourced.

💡 Pro Tip: Before shipping to production with WebGPU, always pair your navigator.gpu check with a WebGL fallback — support is conditional even on desktop Safari (default-on only on macOS 26 Tahoe), so assuming "it's supported" without feature detection gets you a white screen in production.

Table of Contents

Support Table and Platform Conditions (December 4, 2025)

WebGPU's spec status is W3C Candidate Recommendation Draft — the w3.org publication history shows the immediately preceding version dated November 26, 2025, at the same status. According to caniuse.com/webgpu, the browser matrix differs significantly per platform; the table below summarizes the state as of December 4, 2025.

Desktop and Mobile Browser Matrix

Browser
Status (December 4, 2025)
Note
Chrome / Edge
Supported (since version 113)
Default on; not on Linux in Chrome (caniuse #5) — no caniuse note on the Edge row
Safari (desktop)
Partial support (26.0–26.1)
Default on only on macOS 26 Tahoe
Safari (iOS)
Supported (since 26.0)
Full support, unlike desktop
Firefox
Partial support (since version 141)
Default on Windows (145+ also macOS 26 Tahoe/Apple Silicon); elsewhere dom.webgpu.enabled
Opera
Supported (since version 99)
Chromium-based; not default on Linux (caniuse #5)

Source: caniuse.com/webgpu table and release notes.

What Safari's "Partial Support" Note Actually Means

The "Partial support" label on Safari's caniuse row isn't a random warning — it's tied to a specific condition: caniuse's own note states, "Partial support refers to only being enabled by default on macOS 26 Tahoe or later." So even with Safari 26.0 installed, WebGPU can remain off by default if the underlying OS is older than macOS 26 Tahoe. That means you need to segment your desktop Safari user base: the same Safari version number behaves differently depending on the OS version.

The source of the Tahoe condition is caniuse's note #7; WebKit's announcement only confirms the version: under the heading "WebKit for Safari 26.0 adds support for WebGPU," it states that WebGPU has been active in Safari Technology Preview for over a year and now ships with Safari 26.0 for macOS, iOS, iPadOS, and visionOS.

WebGPU vs WebGL: The Architectural Difference

WebGPU isn't a continuation of WebGL — it's an entirely new generation of API. The difference isn't just performance; the native GPU layer each one targets is different too.

Why WebGL Isn't Evolving Anymore

MDN's WebGPU_API page sums this up clearly: "There are no more updates planned to OpenGL (and therefore WebGL), so it won't get any of these new features. WebGPU on the other hand will have new features added to it going forwards." In other words, WebGL is frozen along with the OpenGL ES 2.0 family it rests on; it can't take advantage of new GPU capabilities (compute, a modern memory model, low-level control). WebGPU, by contrast, was designed to map to modern native GPU APIs like Direct3D 12, Apple Metal, and Vulkan.

Compute Shaders: A Capability WebGL Doesn't Have

In MDN's words, WebGPU "supports graphic rendering, but also has first-class support for GPGPU computations." WebKit's Safari 26.0 announcement makes this concrete: "Additionally, it adds compute shaders, which allow general purpose computations on the GPU, something not previously possible with WebGL." In practice, this means you can now offload work like image processing, physics simulation, or small-scale machine learning inference to the GPU in the browser — in a way WebGL never made possible.

Comparison Table

Feature
WebGL
WebGPU
Underlying native layer
OpenGL ES 2.0 family
Maps to Metal / Direct3D 12 / Vulkan
Compute shader support
None
Yes (via WGSL)
Future development
Not planned (frozen)
Actively developed
Shader language
GLSL ES
WGSL
Position in Safari
Legacy, restricted
Recommended for new sites ("supersedes WebGL")

In WebKit's own words, WebGPU "supersedes WebGL on macOS, iOS, iPadOS, and visionOS and is preferred for new sites and web apps." That's a clear signal of Apple's own platform direction — but as you'll see in the next section, other browsers (especially Firefox) haven't matched that pace.

Fallback Strategy: Firefox and Older Devices

If you can't ignore your Firefox user base (and most production sites can't), coding WebGPU as the only path is risky. Per caniuse data, Firefox support depends on platform: default on Windows since version 141, joined by macOS 26 Tahoe (Apple Silicon) from version 145 onward; Linux and older macOS still need the dom.webgpu.enabled flag. So the same Firefox version shows or hides WebGPU depending on the OS.

The navigator.gpu Check

Feature detection isn't optional in WebGPU projects — it's a mandatory first step:

js
1async function initGpu() {
2 if (!("gpu" in navigator)) {
3 console.warn("WebGPU desteklenmiyor, WebGL fallback devrede.");
4 return null;
5 }
6 
7 const adapter = await navigator.gpu.requestAdapter();
8 if (!adapter) {
9 console.warn("Uygun GPU adaptörü bulunamadı, WebGL fallback devrede.");
10 return null;
11 }
12 
13 return await adapter.requestDevice();
14}

This pattern handles three distinct failure points separately: the API doesn't exist at all (navigator.gpu is undefined — flag-gated Firefox platforms, or Safari pre-macOS Tahoe), the API exists but no adapter was found (old/integrated GPU), or an adapter exists but the device request was rejected. All three should fall through to the same fallback path.

The WebGL Fallback Pattern

In practice, the most robust approach is to abstract the render layer and decide which backend to use at runtime:

js
1const device = await initGpu();
2 
3const renderer = device
4 ? createWebGpuRenderer(device)
5 : createWebGlRenderer(canvas);
6 
7renderer.draw(scene);

The critical point here: createWebGpuRenderer and createWebGlRenderer must share the same draw(scene) interface. Otherwise you're stuck growing two backends in lockstep, and maintenance cost compounds. This is exactly why frameworks like Three.js and Babylon.js expose their WebGPU renderer as an "optional backend" — the scene graph stays the same; only the render backend changes.

First Compute Shader: Pipeline Setup

Let's look at WebGPU's real differentiator — compute shaders, which WebGL can't do — with a small example: a minimal pipeline that doubles every element in a number array on the GPU.

Getting the Adapter and Device

Every WebGPU program starts with the same three steps: request an adapter, request a device, compile the shader module.

js
1const adapter = await navigator.gpu.requestAdapter();
2const device = await adapter.requestDevice();
3 
4const shaderModule = device.createShaderModule({
5 code: computeShaderCode, // the WGSL code below
6});

requestAdapter() gives you a handle to the physical GPU, while requestDevice() opens the logical device through which you actually submit commands to that adapter. This API surface (GPUDevice, GPUShaderModule) matches the naming used in MDN's WebGPU_API reference exactly.

Bind Group, Pipeline, and Dispatch

First, we write the shader in the language the GPU understands, WGSL (WebGPU Shading Language):

wgsl
1@group(0) @binding(0) var<storage, read_write> data: array<f32>;
2 
3@compute @workgroup_size(64)
4fn main(@builtin(global_invocation_id) id: vec3<u32>) {
5 data[id.x] = data[id.x] * 2.0;
6}

Then we wire this shader into a compute pipeline — following the steps in MDN's GPUDevice.createComputePipeline() reference example:

js
1const bindGroupLayout = device.createBindGroupLayout({
2 entries: [
3 {
4 binding: 0,
5 visibility: GPUShaderStage.COMPUTE,
6 buffer: { type: "storage" },
7 },
8 ],
9});
10 
11const computePipeline = device.createComputePipeline({
12 layout: device.createPipelineLayout({
13 bindGroupLayouts: [bindGroupLayout],
14 }),
15 compute: {
16 module: shaderModule,
17 entryPoint: "main",
18 },
19});

GPUShaderStage.COMPUTE visibility declares that this buffer is only accessible during the compute stage; buffer: { type: 'storage' } matches the memory type the shader declares with var<storage, read_write>. The final step to submit the command and run the GPU is the computePass.dispatchWorkgroups() call — it determines how many workgroups get dispatched based on the array's size.

Mobile Safari and Chrome: The Thermal/Battery Reality

Let's be clear on this point: neither Apple nor Google has published an official measurement of a specific battery consumption or thermal-increase figure for WebGPU on mobile. The only thing we have to go on is the general principle of GPU programming: because compute shaders keep the GPU busier and more continuously occupied than the CPU, long-running GPU workloads (especially on mobile) carry the potential to increase heat and battery drain — this isn't specific to WebGPU, it's a general GPU-programming fact that also applies to native Metal/Vulkan compute workloads.

In place of a concrete figure, here's concrete advice: before shipping a WebGPU-based feature to production on mobile Safari or Chrome for Android, test a long session on a real device (not a simulator), observe device heating and battery percentage, and where possible keep the workload bounded by user interaction (favor short jobs triggered on demand over a compute loop that keeps running in the background).

When Not to Use It: Decision Criteria

Once the support table and fallback pattern are clear, the real decision comes down to three questions:

  • Does a significant part of your user base run Firefox? Since WebGPU on Firefox is default-on only on Windows (plus macOS 26 Tahoe/Apple Silicon from 145+), making WebGPU the only path is risky for a Firefox audience skewed toward Linux or older macOS — in that case WebGL should be the primary path and WebGPU an "if available" enhancement.
  • Is your desktop Safari users' OS version unknown? WebGPU can stay off on pre-macOS 26 Tahoe versions; if your analytics don't break down macOS version distribution, design WebGPU as an optional path for desktop Safari.
  • Does the feature genuinely need compute shaders? If you're only doing 2D/3D rendering and WebGL already suffices, the complexity-to-payoff ratio of moving to WebGPU can be low — WebGPU's real differentiator is GPGPU/compute capability.

If two of these three criteria come back "no," treating WebGPU as progressive enhancement (WebGL as the default, WebGPU kicking in when detected) is the safest path.

Which Frameworks Already Use WebGPU

You don't have to write your own WebGPU pipeline from scratch. WebKit's Safari 26.0 announcement lists the frameworks already using WebGPU in production this way: Babylon.js, Three.js, Unity, PlayCanvas, Transformers.js, and ONNX Runtime — "Currently, Babylon.js, Three.js, Unity, PlayCanvas, Transformers.js, ONNX Runtime and others all work great in Safari 26.0." Of these frameworks, Three.js and Babylon.js offer a backend abstraction that automatically falls back to WebGL when WebGPU isn't available; so instead of hand-writing the fallback pattern above, you can rely on the framework's own backend selection.

GOLDEN TIP

The most valuable insight in this article

This tip holds the article's most important takeaway.

Easter Egg

You found a hidden gem!

There's a hidden detail in this section. Want to uncover it?

Reader Reward

I put together a short checklist you should review before shipping to production with WebGPU — every line here is backed by a source cited in this post, and it's ready to copy-paste.

FAQ

Which browsers support WebGPU?

As of December 4, 2025, Chrome and Edge support it by default since version 113, Opera since version 99, Safari on iOS has full support since 26.0, Safari on desktop is "partial support" between versions 26.0–26.1 with default-on only on macOS 26 Tahoe, and Firefox has been default-on on Windows since version 141 (plus macOS 26 Tahoe/Apple Silicon from 145+), behind the dom.webgpu.enabled flag elsewhere.

Can WebGPU be used in production projects?

It can, but conditionally: it's directly reliable for a Chrome/Edge/Opera user base, reliable for Safari on iOS, and needs a WebGL fallback for desktop Safari and Firefox. Even though the spec is at W3C Candidate Recommendation Draft status, production frameworks like Babylon.js, Three.js, Unity, and PlayCanvas already use WebGPU as a backend.

How long should I keep the WebGL fallback?

There's no announced date for WebGPU becoming default-on on the Firefox platforms that still require the flag (Linux, older macOS). So giving a clean "remove it by this date" answer would be misleading; it's more reliable to keep the fallback while tracking your own analytics for your audience's browser/OS distribution, until the share of flag-gated platforms drops to a negligible level.

Can I use WebGPU and WebGL at the same time?

Not on the same <canvas> at once, but at the app level you can use them as each other's fallback. Most frameworks (Three.js, Babylon.js) make this choice automatically at runtime based on whether navigator.gpu exists; if you're writing it manually, it's recommended to decide the backend once and keep it fixed throughout the render loop (see Golden Tip).

Why is WebGPU on Safari still marked "partial support"?

Because support depends on the OS version: caniuse's own note states that partial support means "only being enabled by default on macOS 26 Tahoe or later." Even with Safari 26.0 installed, WebGPU can stay off if the underlying macOS is older than Tahoe — which means "using Safari 26" alone isn't sufficient information.

Update (September 2026)

The body of this article reflects the support state as of December 4, 2025. Since then, there have been concrete, sourced advances across platforms:

  • Safari 27.0 (September 17, 2026) added the clip_distances WGSL built-in to WebGPU (clip plane support) — the only concrete WebGPU addition within the 26.6 and 27.0 release notes. Source: webkit.org/blog/18325/webkit-features-for-safari-27-0/
  • Safari 26.6 release notes have no WebGPU-related changes; so WebGPU progress didn't happen within the 26.x series, it concentrated in 27.0. Source: webkit.org/blog/18178/webkit-features-for-safari-26-6/
  • Chrome 144 (January 7, 2026) added subgroup_id and num_subgroups built-ins to WGSL. Source: developer.chrome.com/blog/new-in-webgpu-144
  • Chrome 146 (February 25, 2026) introduced a "Compatibility Mode" for WebGPU — a more restricted subset targeting OpenGL ES 3.1 — first on Android, with research ongoing for ChromeOS and Windows (D3D11). Source: developer.chrome.com/blog/new-in-webgpu-146
  • Desktop Safari remains in "Partial support" status; per caniuse's note #7, it's default-on only on macOS 26 Tahoe or later. Source: caniuse.com/webgpu
  • The Firefox table hasn't changed since December 2025: caniuse's note #8 says "Only enabled by default on Windows as well as macOS 26 Tahoe or later on Apple Silicon"; Linux and older macOS still need dom.webgpu.enabled. Source: caniuse.com/webgpu

In short, as of September 2026 the core picture is the same as in December 2025: Chrome/Edge/Opera reliable, Safari iOS reliable, desktop Safari and Firefox still conditional. The real progress hasn't been in new platforms turning on support, but in the WGSL feature set expanding on existing platforms (subgroups, clip distances, compatibility mode).

Conclusion

There's no one-sentence answer to "is WebGPU production-ready" — yes for Chrome/Edge/Opera and iOS Safari, still a conditional yes for desktop Safari and Firefox. The right approach is to design WebGPU not as the only path, but as a progressive-enhancement layer detected via a navigator.gpu check that falls back cleanly to WebGL. If you're doing native GPU development on Apple platforms, Apple's own GPU programming with the Metal Framework guide or the SwiftUI Metal Shaders post are good references for comparison; on the web side, for build/tooling decisions, you can check out the Next.js 16.3 Instant Navigations guide, the Webpack-to-Vite migration guide, and the TypeScript 7 Go compiler migration decision post — other platform-decision pieces from this campaign.

Sources

Tags

#WebGPU#WebGL#Safari#WGSL#compute shader#browser support#GPU#web performance
Muhittin Çamdalı

Muhittin Çamdalı

Lead Mobile Engineer

Lead Mobile Engineer with 12+ years of experience. Expert in iOS, Android and cross-platform architectures with Swift, SwiftUI, Kotlin and Flutter. I build performant, user-friendly mobile apps.

iOS Development News

Weekly Swift tips, SwiftUI tricks and iOS best practices. No spam, only valuable content.

We respect your privacy. You can unsubscribe at any time.

Share