Docs/WebGPU Backend
Experimental 2D renderer WGSL shaders

WebGPU / WebAssembly Backend

Run the same Spectra C++ plotting code natively with Dawn or in the browser with Emscripten. The WebGPU path is experimental, focused on polished 2D plots, dashboards, and browser demos without Vulkan.

2D line, scatter, grid, axes, text
Stats histogram, bar, box, violin
Native + WASM Dawn or browser WebGPU
Spectra WebGPU Workbench Frame 184 / GPU queue healthy
pan zoom inspect msdf text
0 50 100 samples live FFT + residual distribution x 3.84s y 91.2
Backend scope

What's supported today

WebGPU currently tracks Spectra's 2D drawing model. It is useful for browser demos and embedded dashboards, while Vulkan remains the production backend for the full feature set.

Dual backend strategy

Same renderer API — production Vulkan or experimental WebGPU via Dawn / Emscripten WASM.

WebGPU dual runtime
Diagram gallery →
Implemented

2D plotting primitives

  • Line series with SDF anti-aliasing
  • Scatter series with all 18 marker types
  • Grid lines, axes, and MSDF text rendering
  • Statistical series: histogram, bar, box, and violin
Not yet ported

Full desktop runtime features

  • 3D pipelines: surface, mesh, scatter3, line3, and lighting
  • Multi-process / IPC mode because browsers do not expose Unix sockets
  • Video export to MP4 or GIF
  • Runtime plugin loading because wasm has no dlopen
Current status: experimental and 2D-only. For production scientific workflows that need 3D rendering, IPC, plugins, or export pipelines, use the Vulkan backend.
Build paths

Native or browser targets

Native Dawn Desktop WebGPU

Build and link against a local Dawn install.

cmake -B build \
  -DSPECTRA_USE_WEBGPU=ON \
  -Ddawn_DIR=/path/to/dawn/install/lib/cmake/dawn \
  -DCMAKE_BUILD_TYPE=Release
cmake --build build --target webgpu_demo
./build/examples/webgpu_demo

You can also link against wgpu-native by pointing CMake at its install prefix.

Emscripten Browser WebGPU 
source /path/to/emsdk/emsdk_env.sh
emcmake cmake -B build-wasm \
  -DSPECTRA_USE_WEBGPU=ON \
  -DCMAKE_BUILD_TYPE=Release
cmake --build build-wasm --target webgpu_demo

# Serve and open in a WebGPU-capable browser (Chrome / Edge 113+)
python3 -m http.server -d build-wasm/examples
# http://localhost:8000/webgpu_demo.html

The static HTML shell is examples/webgpu_shell.html.

Application code

Same plotting API

User code is identical to the Vulkan backend. Select WebGPU at build time with SPECTRA_USE_WEBGPU.

#include <spectra/app.hpp>
#include <spectra/easy.hpp>

int main()
{
    spectra::plot({0.f, 1.f, 2.f, 3.f}, {0.f, 1.f, 0.5f, 1.5f}, "c-o");
    spectra::title("Hello WebGPU");
    spectra::show();
}

The full example is in examples/webgpu_demo.cpp.

Shader layout

Mirrored WGSL path

GLSL Vulkan shaders are mirrored as WGSL in src/render/webgpu/shaders/. When a 2D Vulkan shader changes, port the equivalent .wgsl file to keep both backends in sync.

C++ plot calls Renderer abstraction WebGPU backend WGSL shader modules
Related

Keep exploring

Architecture Backend abstraction layer Source src/render/webgpu/ and WGSL shaders