Build and optimize WebGPU apps with the vgpu package and entrypoints vgpu/node, vgpu/mock, vgpu/scene, and vgpu/client. Use @vgpu/render/inspect, /utils, /edit, and /perf only as slim tooling subpaths. Bundles performance guides and the API reference; load one doc at a time.
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Une commande directe contourne le prompt de vérification. Examinez la source avant de l'exécuter.
La commande reste sur une seule ligne. Faites défiler horizontalement pour la vérifier avant de la copier.
Vous préférez une copie locale ? Téléchargez les fichiers actuellement disponibles dans SkillsMP.
Explorateur de fichiers
94 fichiers
Affichage de SKILL.md
SKILL.md
Instructions source · Aperçu en lecture seule
name
vgpu
description
Build and optimize WebGPU apps with the vgpu package and entrypoints vgpu/node, vgpu/mock, vgpu/scene, and vgpu/client. Use @vgpu/render/inspect, /utils, /edit, and /perf only as slim tooling subpaths. Bundles performance guides and the API reference; load one doc at a time.
vgpuVersion
0.3.0
gitSha
ad9d38af0e144d12ad1182e0303253b5d27d4754
generatedAt
"2026-08-20T15:31:32.100Z"
vgpu
Generated from the vgpu .docs.md source. Each entry maps to a file in references/ and to a
doc you can load on demand with the CLI — load only what you need, don't read the whole skill:
vgpu is layered: vgpu/core (thin WebGPU wrappers) → vgpu (main API with WGSL reflection) → vgpu/scene (geometry/camera helpers). Lower layers are always accessible and interoperable.
Glossary: Surface means a canvas-backed render target (swapchain) created with surface(gpu, canvas); do not confuse it with the general phrase ‘API surface’.
Context — Everything in vgpu starts from one call. references/guides/concepts-context.docs.md
Draws — A Draw renders geometry with custom vertex buffers: you write both the vertex and the fragment stage, and a geometry supplies the buffers. references/guides/concepts-draws.docs.md
Compilation — Pipelines compile lazily: the first draw() against a new target pays the pipeline creation cost, and that cost lands inside your frame. references/guides/concepts-compilation.docs.md
Effects — An Effect is a full-screen fragment shader created with effect(gpu, source). references/guides/concepts-effects.docs.md
Passes — A pass is a render-pass section inside a frame. references/guides/concepts-passes.docs.md
Frames — A frame is one unit of GPU work. references/guides/concepts-frames.docs.md
Render bundles — A render loop re-encodes every pipeline, bind group, and draw on every tick — even when nothing changed. references/guides/concepts-render-bundles.docs.md
Writing or optimizing a shader? Read performance-model first, then the rest as needed.
WebGPU screenshots with agent-browser — Use agent-browser to verify and capture vgpu previews that run WebGPU on Linux, including containers without a GPU. references/guides/agent-browser-webgpu.docs.md
Authoring shaders for performance — Write WGSL so reflection can build stable layouts. references/guides/authoring-for-perf.docs.md
Browser testing with Playwright WebGPU — Browser tests should exercise the same public API users copy: init(), surface(gpu, canvas, opts), explicit targets, and deterministic frame submiss… references/guides/browser-testing.docs.md
External ticker — By default vgpu owns the clock: every frame(gpu) moves clock(gpu).time forward by the wall-clock delta since the last frame, and frameLoop(gpu, cb)… references/guides/external-ticker.docs.md
Getting started — Start with the public vgpu package. references/guides/getting-started.docs.md
Measuring — Measure the thing you intend to optimize: CPU encoding, pipeline warm-up, bind-group churn, target memory, or shader cost. references/guides/measuring.docs.md
Overview — Share one GPUDevice between vgpu and a machine learning runtime so model outputs stay on the GPU. references/guides/ml.docs.md
Quickstart: Browser — In this quickstart you run an ONNX model with ONNX Runtime Web's WebGPU execution provider and consume its output with vgpu shaders — on one shared… references/guides/ml-browser.docs.md
Buffers & ownership — ts export interface InitOptions { readonly adapter?: VGPUAdapter; / Never set: adoption lives in initFromDevice(device). references/guides/ml-buffers.docs.md
Quickstart: Node — In this quickstart you run the same integration in Node, with Dawn providing WebGPU. references/guides/ml-node.docs.md
Using vgpu with Next.js and other bundlers — effect(gpu, source) takes WGSL as a string, so nothing forces you to use a bundler loader. references/guides/nextjs.docs.md
Using vgpu without a bundler — effect(gpu, source) and draw(gpu, { shader }) take WGSL as a plain string, so nothing forces you to use a bundler. references/guides/no-bundler.docs.md
Optimize a pass — Optimize one pass by first deciding what changes every frame. references/guides/optimize-pass.docs.md
API reference
258 symbols across 20 packages — open references/<package>/<file> or npx -y vgpu docs cat <symbol>:
Performance model — vgpu's public API is organized around stable identities. references/guides/performance-model.docs.md
Performance patterns — This is the quick index. references/guides/performance-patterns.docs.md
Performance playbook: write fast vgpu by default — This guide is for LLMs and humans writing shaders. references/guides/performance-playbook.docs.md
Publishing WGSL module packages — A WGSL module package is an ordinary npm package whose exports map points at .wgsl files instead of JavaScript. references/guides/publishing-wgsl-packages.docs.md
Debugging shaders by extracting internal values — A shader has no console.log. references/guides/shader-debugging.docs.md
Shader diagnostics and fix-its — Use these messages as the self-correction map for generated shader code. references/guides/shader-fix-its.docs.md
The default workflow for developing shaders with vgpu — Follow these eight steps in order every time you write or change a shader. references/guides/shader-workflow.docs.md
Practical texture-format matrix — Choose a target format from the operations it must support, not just its channel precision. references/guides/texture-formats.docs.md
Two-pass rendering: offscreen depth target composited to the canvas — Surfaces and canvases have no depth buffer, and Draws need one for any real 3D scene. references/guides/two-pass-rendering.docs.md
