WGSL linting, WebGPU API validation, GPU diagnostics, and live debugging — all inside VS Code.
Features
WGSL Inline Diagnostics
Real-time error detection as you write WGSL shaders:
- Non-uniform control flow — catches
textureSample() inside if/switch blocks
- Uninitialized variables — flags
var declarations used before assignment
- Spec limit violations — detects
@location indices exceeding WebGPU limits
- Derivative restrictions — warns when
dpdx/dpdy/fwidth are used outside fragment shaders
WebGPU API Validation (JS/TS)
Catches common WebGPU mistakes in your JavaScript and TypeScript files:
- Buffer usage flag mismatches (
MAP_READ without COPY_DST, UNIFORM without COPY_DST)
- Texture format misuse (depth format as color attachment, color format as depth)
- Auto-layout mixing with explicit pipeline layouts
queue.writeBuffer() to buffers missing COPY_DST
WGSL Syntax Highlighting
Full TextMate grammar for .wgsl files including attributes, builtins, types, and numeric literals.
GPU Diagnostics Scan
Run WebGPU: Run GPU Diagnostics Scan to get a full report of your GPU environment — driver info, VRAM, temperature, TDR configuration, and incident history.
Live Debug Bridge
Connect to a running WebGPU application via WebSocket to see real-time renderer state, camera, parameters, FPS, and errors directly in VS Code.
Commands
| Command |
Description |
WebGPU: Lint Current WGSL File |
Run linter on the active WGSL file |
WebGPU: Run GPU Diagnostics Scan |
Open GPU diagnostics panel |
WebGPU: Connect Debug Bridge |
Connect to a running WebGPU app |
WebGPU: Disconnect Debug Bridge |
Disconnect from debug bridge |
WebGPU: Show Live Debug Panel |
Open live state viewer |
WebGPU: Open Watchdog Dashboard |
Open monitoring dashboard |
Settings
| Setting |
Default |
Description |
webgpu.wgslLint.enable |
true |
Enable WGSL inline diagnostics |
webgpu.wgslLint.onType |
true |
Lint as you type (debounced) |
webgpu.wgslLint.debounceMs |
500 |
Debounce delay for on-type linting |
webgpu.jsValidation.enable |
true |
Enable WebGPU API validation in JS/TS |
webgpu.debugBridge.port |
9876 |
Debug bridge WebSocket port |
webgpu.debugBridge.autoConnect |
false |
Auto-connect on activation |
Requirements
- VS Code 1.85+
- For GPU diagnostics: Windows with nvidia-smi (NVIDIA GPUs)
- For debug bridge: A WebGPU app using
webgpu-debug-bridge client
License
MIT
