WebGPU Inspector MCP
WebGPU Inspector MCP is an MCP server that drives an instrumented Chrome/Chromium/Edge to capture, profile, inspect, and interactively debug WebGPU frames and WGSL shaders.
Browser automation: launch or attach to Chrome/Edge via CDP, open instrumented tabs, list pages, check status, and take composited page screenshots.
Frame capture: capture WebGPU frames (render/compute passes) with optional GPU timestamp profiling, payload caps, pass filters, and profilePasses mode.
Capture analysis: load
.wgpuc/.jsoncaptures and inspect summaries, command lists, GPU objects, WGSL shaders, validation errors, and heuristic performance/correctness issues.State inspection: resolve full draw/dispatch state (pipeline, bind groups, vertex/index buffers, draw params), decode vertex buffer attributes, and diff the state of two draws.
Performance profiling: diagnose frame budget and CPU/GPU/vsync bound verdicts, rank passes by GPU time, and identify bottlenecks like fillrate vs fragment-ALU with concrete suggestions.
Live GPU inspection: read current buffer contents and texture regions from a connected page (with stats and ASCII views) without a full capture, plus sample live frame rate, frame time, drops, and CPU submit cost.
Interactive shader debugging: start/step/continue WGSL debug sessions for compute, vertex, or fragment invocations; set breakpoints; inspect variables; get callstacks; and evaluate path expressions like
in.position.xor matrix/vector elements.
Launches and controls Chrome/Chromium via CDP, injecting WebGPU Inspector into pages to enable live frame capture, performance profiling, and resource inspection.
Provides tools for capturing and inspecting live WebGPU frames, profiling GPU timestamp performance, reading buffers and textures, and analyzing WGSL shaders to diagnose rendering issues.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@WebGPU Inspector MCPCapture the next frame and profile its GPU timestamps."
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
WebGPU Inspector MCP
An OpenCode / Model Context Protocol (MCP) server for WebGPU Inspector.
It allows AI assistants to drive Chrome/Chromium to capture live WebGPU frames, profile frame performance, inspect WGSL shaders, buffers, textures, diagnose WebGPU rendering issues, and step-debug WGSL compute, vertex, and fragment shaders interactively.
Features
Automated Browser Instrumentation: Launches Chromium/Chrome/Edge via CDP and injects WebGPU Inspector into every page before page scripts run.
Interactive Shader Debugging (8 Tools): Step-by-step WGSL debugging for compute, vertex, and fragment shaders with breakpoints, variable inspection, callstack unwinding, and expression evaluation.
Capture File Analysis & Live Inspection (21 Tools): Tools for browser control, frame capture, GPU timestamp profiling, live buffer/texture reads, draw state diffing, and shader inspection. Load and inspect
.wgpucbinary files or.jsonrecordings without running a browser.
Related MCP server: Chrome DevTools MCP
Installation
git clone git@github.com:lpenguin/webgpu_inspector_mcp.git
cd webgpu_inspector_mcp
npm installMCP Configuration
Add the server to your opencode.json (or Claude desktop configuration):
{
"mcp": {
"webgpu-inspector": {
"type": "local",
"command": ["node", "/path/to/webgpu_inspector_mcp/index.js"],
"enabled": true,
"environment": {
"WEBGPU_BRIDGE_PORT": "9690",
"WEBGPU_BRIDGE_CAPTURES_DIR": "/path/to/webgpu_inspector_mcp/captures"
}
}
}
}Shader Debugging Tools
The server provides 8 dedicated tools for interactive shader debugging powered by wgsl_reflect:
Tool | Description | Key Parameters |
| Starts an interactive debugging session for a compute dispatch, vertex draw, or fragment pixel. |
|
| Advances shader execution by stepping lines or instructions. |
|
| Continues execution until a line breakpoint is hit, the shader finishes, or |
|
| Sets, removes, or clears line breakpoints in the active session. |
|
| Returns the current callstack / call frames (innermost frame first) with function names and line numbers. |
|
| Inspects variables categorized by scope ( |
|
| Evaluates path expressions (e.g. |
|
| Stops and disposes an active debug session, freeing associated resources. |
|
Invocation Coordinates by Stage
When starting a debug session with shader_debug_start, provide the target invocation:
Compute:
{ "threadId": [x, y, z] }or{ "dispatchId": [x, y, z] }Vertex:
{ "vertexIndex": 0, "instanceIndex": 0 }(fetches vertex buffer attributes automatically)Fragment:
{ "pixelX": 100, "pixelY": 100 }(interpolates vertex outputs / varyings and@builtin(position)at pixel center)
Base Inspection & Profiling Tools (21 Tools)
Tool | Description |
| Launch a new instrumented Chrome/Edge instance via CDP. |
| Attach to an already-running Chrome/Edge on a remote debugging port. |
| Open a new instrumented tab in the controlled browser. |
| Check browser connection and instrumented pages status. |
| List connected WebGPU pages. |
| Capture a composited PNG screenshot of the presented canvas/page. |
| Request frame capture from connected page with optional GPU profiling. |
| List captures currently loaded in the store. |
| Load a |
| Get high-level summary of passes, draw calls, objects, and validation errors. |
| Profile GPU duration per pass and diagnose bottlenecks (fillrate vs ALU). |
| Return paginated list of GPU commands in capture. |
| Inspect GPU object descriptor (buffers, textures, pipelines). |
| Retrieve WGSL source code of a ShaderModule. |
| Get WebGPU validation errors recorded during capture. |
| Resolve pipeline, bound vertex buffers, index buffers, and bind groups for a draw/dispatch. |
| Decode captured vertex buffer payloads into typed attribute values. |
| Structurally diff the state between two draw calls. |
| Read live GPU buffer contents from connected page. |
| Read live GPU texture / render target region and return statistics and ASCII view. |
| Sample live frame rate, frame time variance, and CPU submit cost. |
Environment Variables
All environment variables are optional:
Variable | Default | Description |
|
| Directory where uploaded |
|
| Port for the local HTTP + WebSocket bridge that instrumented pages connect to. If the default port is already occupied by another session, the bridge automatically falls back to an OS-assigned free port. |
|
| Bind address for the local bridge server. |
| (auto-detected) | Custom binary path for Google Chrome, Chromium, or Microsoft Edge. Auto-detects standard system paths if omitted. |
| (none) | Optional auth token required for instrumented pages to connect to the bridge. |
| (bundled) | Path or URL to custom |
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Connectors
Live browser debugging for AI assistants — DOM, console, network via MCP.
Headless browser primitives for AI agents when sites need real JS rendering.
SEO & marketing toolkit for AI agents: GA4, Search Console, AdSense, GTM, PageSpeed, Trends.
A paid remote MCP for AI agent browser DevTools MCP, built to return verdicts, receipts, usage logs,
Related MCP Servers
- AlicenseNot gradedqualityAmaintenanceEnables AI coding assistants to control and inspect a live Chrome browser through Chrome DevTools. Provides browser automation, performance analysis, debugging capabilities, and network request monitoring.3,288,16550,162Apache 2.0
- AlicenseAqualityCmaintenanceEnables AI coding assistants to control and inspect a live Chrome browser for automation, debugging, performance analysis, and screenshot capture through Chrome DevTools.263,288,1653Apache 2.0
- AlicenseNot gradedqualityDmaintenanceEnables AI coding assistants to control and inspect a live Chrome browser for automation, debugging, performance analysis, network monitoring, and DOM interaction through Chrome DevTools Protocol.3,288,165Apache 2.0
- -licenseNot gradedqualityNot gradedmaintenanceEnables AI coding assistants to control and inspect a live Chrome browser for automated debugging, performance analysis, and web interaction. It leverages Puppeteer and Chrome DevTools to provide capabilities like network monitoring, console logging, and automated browser actions.
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/lpenguin/webgpu_inspector_mcp'
If you have feedback or need assistance with the MCP directory API, please join our Discord server