Skip to content
alyn
dzhng

Renderer skill

Architecture rules for GPU rendering with TypeGPU/WebGPU. Use when adding or changing render passes, shaders, frame orchestration, GPU resources, culling, terrain, shadows, or visual performance work.

$npx skills add dzhng/skills --skill renderer
View this skill on GitHubdzhng/skills/skills/graphics/renderer/SKILL.md
Pack stars
1,471
Pack installs
7.1k
Alyn Score
56/99
Updated
4 h ago
License
MIT
– views – installs via Alyn

Install Renderer

Pick your agent. Every command is ready to paste.

$npx skills add dzhng/skills --skill renderer

The open skills CLI detects your agents (Claude Code, Cursor, Codex and 70+ more) and installs to the right folder. Add -g to install globally.

01

Install it

Run the command above, or upload the folder in Claude.

02

Ask naturally

Describe the task. Your agent loads renderer when the request matches its description.

03

Name it if needed

If it does not trigger, say “use the renderer skill”. In Codex, type $renderer.

The skill itself

SKILL.md

FolderGitHub

GPU renderer

The renderer is TypeGPU over WebGPU. It draws plain frame inputs the application hands it and never reaches into simulation or app state. These are the flaws that sink a 3D experience; check a change against each before writing it.

  • Fixed-view cost never grows with world size. For a fixed camera and render size, submitted geometry, shadow casters, and per-frame lists are bounded by what the view can see or cast into, and screen-space work by pixels. Store the world map-wide; select from it spatially. Frustum clipping does not make vertices free. Compare equal local content and finite view distance: admitting more world changes the workload.
  • Detail follows projected size. Correct culling can still admit thousands of tiny meshes. Bound each visible instance’s geometry by its screen footprint as well as bounding the selected population.
  • One owner per contract. Frame orchestration, camera, depth convention, targets, culling, lighting, timing, and resource lifetime each have one owner every pass shares. Extend it; a second copy drifts.
  • Shared contracts change together. Depth and lighting are engine-wide: every pass reads the same convention and every material the same shading path. A per-pass exception is a future visual bug.
  • No GPU resource without a lifetime owner. Everything is allocated through the registry, rebuilds swap in whole, and repeated resize/rebuild/reset returns to baseline.
  • Pixels prove correctness, not counters. An optimization is accepted only with an interleaved A/B on the real GPU and an image that shows the subject still drawn correctly.

Tips for Renderer

  • • Start a fresh session after installing so your agent picks up the new skill.
  • • It is part of a pack with 30 skills. Install only the ones you need with --skill to keep triggers precise.
  • • If two skills overlap, mention the one you want by name.

Questions about Renderer

What does the Renderer skill do?

Architecture rules for GPU rendering with TypeGPU/WebGPU. Use when adding or changing render passes, shaders, frame orchestration, GPU resources, culling, terrain, shadows, or visual performance work.

How do I install Renderer?

Run "npx skills add dzhng/skills --skill renderer" in your project. The skills CLI installs it for Claude Code, Cursor, Codex and 70+ other agents. In Claude on the web, upload the skill folder as a ZIP under Customize > Skills.

Does Renderer work in Cursor and Codex?

Yes. Renderer uses the open SKILL.md format, so it works in Claude Code, Claude, Cursor, OpenAI Codex, Gemini CLI, GitHub Copilot and other agents that support agent skills.

Is Renderer free?

Renderer is open source on GitHub under the MIT license. It is free to install; check the license before commercial use.

Who made Renderer?

Renderer is published by dzhng in the dzhng/skills repository, together with 29 other skills.

Similar skills. From other creators.