vgpu-shaderslisted

Decide whether a Next.js 16 project should reach for **WebGPU** at all, then wire `vgpu` in: the `.wgsl` loader (Turbopack/webpack), a `"use client"` canvas that survives SSR, a `prefers-reduced-motion` path the library omits, a headless render snapshot in CI. Non-visual uses too — **compute shaders** (`compute`/`dispatch`, storage ping-pong), `pixelDiff` for visual regression, `gpuFrameTime` as a CI perf gate, server-side image generation, `vgpu/scene`. Triggers: "shader", "WGSL", "WebGPU", "vgpu", "compute shader", "GPU compute", "animated hero", "generative background", "raymarch", "aggiungi uno shader", "sfondo generativo", "calcolo su GPU". **Does not restate the vgpu API** — that is the first-party generated skill (`npx skills add vercel-labs/vgpu`) and its MCP. Records `stack.shaders`; no phase bump. Not for CSS/Motion animation (this is the top rung of that ladder), animated icons, maps, React Native, or WGSL tutorials.
lukedj78/dev-flow · ★ 6 · Web & Frontend · score 78

Install: claude install-skill lukedj78/dev-flow

# vgpu-shaders — should this page have a shader, and what does that cost? [`vgpu`](https://vgpu.sh) is Vercel Labs' WebGPU library "designed for agents": one shader renders in the browser, headless in Node, to a PNG at any resolution, to video, and in CI. WGSL becomes a module graph you `import` like TypeScript — the loader resolves it, reflects bindings, drops unused declarations and emits compact source at build time. ## ⛔ First: this skill does not document the vgpu API, on purpose The API is **258 symbols across 20 packages**, and Vercel ships a **first-party skill generated from the source docs**, stamped with `vgpuVersion` and a `gitSha` in its own frontmatter. Restating it here would duplicate an artefact that regenerates itself, and would be wrong within a release. ```bash npx skills add vercel-labs/vgpu # the generated API skill npx -y add-mcp https://vgpu.sh/api/mcp -g # or the MCP npx -y vgpu docs find <query> | grep -i <term> | cat <symbol> ``` ⚠️ **Their skill is named `vgpu`; this one is `vgpu-shaders`** precisely so both can be installed. What follows is the half nobody else writes: **whether to reach for it, and what you owe the user once you do.** ## It is not only graphics — but for a dev-flow project it almost always is WebGPU is a **GPU compute** API of which rendering is one use, and vgpu exposes both. `Compute`, `ComputeOptions`, `StorageBuffer` and `PingPongStorage` are first-class, and **`initFromDevice(device)`*