Agent skill

Rezi Debug Rendering

by RtlZeroMemory in RtlZeroMemory/Rezi

Debug rendering and layout issues in Rezi apps. An agent skill from RtlZeroMemory/Rezi.

Apache-2.0Auto-check passedDevelopment

Install Rezi Debug Rendering

skills CLI
$ npx skills add RtlZeroMemory/Rezi --skill rezi-debug-rendering -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install RtlZeroMemory/Rezi rezi-debug-rendering --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/RtlZeroMemory/Rezi.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.codex/skills/rezi-debug-rendering .claude/skills/rezi-debug-rendering && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
rezi-debug-rendering
GitHub stars
675
Token cost
~991 tokens
SKILL.md length
379 words
Files
1
Skills in repo
10
Repo updated
First seen
Licence
Apache-2.0

At a glance

Debug rendering and layout issues in Rezi apps. An agent skill from RtlZeroMemory/Rezi.

  • Works in 9 steps: Enable profiling → Check VNode tree structure — ensure no… → Check widget IDs — must be unique across… → …
  • Has layout problems
  • SKILL.md covers When to use, Source of truth, Debugging steps and Common causes
  • Calls node; needs ZRUI_DUPLICATE_KEY

What it does

Rezi Debug Rendering is an agent skill from RtlZeroMemory/Rezi. Debug rendering and layout issues in Rezi apps. Use when UI looks wrong, has layout problems, or renders unexpectedly.

Its SKILL.md is about 990 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Development, covering Debugging. The repository describes itself as: Build TypeScript TUI backed by fast native rendering engine. The licence is Apache-2.0.

When your agent uses it

  • Has layout problems
  • Renders unexpectedly

Example prompts

  • “/rezi-debug-rendering”

Requirements

  • A credential in ZRUI_DUPLICATE_KEY
  • Pre-approved tools (allowed-tools): Read, Glob, Grep, Bash(REZI_PERF=1 *)

Workflow steps

9 steps, taken from the first numbered list in SKILL.md.

  1. Enable profiling
  2. Check VNode tree structure — ensure no missing children or null nodes
  3. Check widget IDs — must be unique across the entire tree. Duplicate IDs cause unpredictable behavior
  4. Check nesting depth
  5. Check key props on list items — missing keys cause full re-render and lost state
  6. Inspect with test renderer
  7. Review layout props: width, height, flex, p, gap, align
  8. If animation is involved, verify
  9. Read enriched runtime errors carefully

What it can do on your machine

Read from SKILL.md and the folder at commit 671a8a2. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves these tools, so the agent can use them without asking each time:

    • Read
    • Glob
    • Grep
    • Bash(REZI_PERF=1 *)

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • node

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names these keys or tokens, usually read from environment variables:

    • ZRUI_DUPLICATE_KEY

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Rezi Debug Rendering loads about 991 tokens when it runs. Until then it costs about 35 tokens; SKILL.md has 379 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~35
When it runs · the whole SKILL.md, loaded when a task matches
~991

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from RtlZeroMemory/Rezi at commit 671a8a2, republished under its Apache-2.0 licence (© RtlZeroMemory). 379 words, ~991 tokens.

Download SKILL.mdSave it as .claude/skills/rezi-debug-rendering/SKILL.md (or your agent's skills folder).
name
rezi-debug-rendering
description
Debug rendering and layout issues in Rezi apps. Use when UI looks wrong, has layout problems, or renders unexpectedly.
allowed-tools
Read, Glob, Grep, Bash(REZI_PERF=1 *)
user-invocable
true
argument-hint
[symptom-description]
metadata.short-description
Debug rendering

When to use

Use this skill when:

  • UI does not look right or has layout problems
  • Widgets overlap, disappear, or have wrong dimensions
  • Unexpected re-renders or flicker
  • Performance issues during rendering

Source of truth

  • packages/core/src/app/widgetRenderer.ts — full render pipeline
  • packages/core/src/app/__tests__/widgetRenderer.transition.test.ts — transition behavior expectations
  • packages/core/src/runtime/commit.ts — VNode → RuntimeInstance tree
  • packages/core/src/layout/ — layout engine
  • packages/core/src/renderer/renderToDrawlist/ — draw operations
  • packages/core/src/widgets/composition.ts — animation hook implementations
  • packages/core/src/ui/ — design tokens, recipes, and capability tiers

Debugging steps

  1. Enable profiling:

    bash
    REZI_PERF=1 REZI_PERF_DETAIL=1 node your-app.js
  2. Check VNode tree structure — ensure no missing children or null nodes

  3. Check widget IDs — must be unique across the entire tree. Duplicate IDs cause unpredictable behavior

  4. Check nesting depth:

    • Warning at 200 levels
    • Fatal at 500 levels
    • Flatten unnecessary wrapper nodes
  5. Check key props on list items — missing keys cause full re-render and lost state

  6. Inspect with test renderer:

    typescript
    const r = createTestRenderer({ viewport: { cols: 80, rows: 24 } });
    const result = r.render(myView(state));
    console.log(result.toText());  // see actual output
    result.findById("my-widget");  // locate specific nodes
  7. Review layout props: width, height, flex, p, gap, align

  8. If animation is involved, verify:

    • container widgets (ui.box, ui.row, ui.column, ui.grid) use transition with expected properties (position, size, opacity)
    • properties: [] is not accidentally disabling tracks
    • opacity stays within [0..1]
    • exitTransition exists on nodes that should animate out before removal
    • keyed re-entry behavior is intentional (same key cancels in-flight exit)
    • exiting nodes are expected to be render-only (not focusable/hit-testable)
    • animation hooks are not conditionally called
  9. Read enriched runtime errors carefully:

    • ZRUI_DUPLICATE_ID now includes both conflicting widget kinds + ctx.id() guidance
    • ZRUI_DUPLICATE_KEY includes the duplicate key and parent context
    • ZRUI_INVALID_PROPS includes prop name, widget kind, and expected type
    • ZRUI_UPDATE_DURING_RENDER includes guidance to move updates into event handlers/effects
Show full SKILL.md (131 more words)Show less

Common causes

SymptomLikely cause
Widget not visibleMissing from VNode tree, or zero width/height
Overlapping widgetsWrong container type (use column/row not box)
Content truncatedFixed width too small, missing flex
Flicker/full re-renderMissing key on list items
Transition not animatingtransition missing, wrong properties, or no actual value delta
Opacity animation looks wrongopacity outside [0..1] (clamped) or properties excludes opacity
Exit animation not visibleMissing exitTransition, zero/invalid duration, or node has no stable key
Exit node still interactiveExit nodes are render-only; focus/hit-test should come from active tree only
Crash on deep treeNesting depth > 500
DS styling not appliedDS styling is automatic with ThemeDefinition; check semantic tokens/theme activation (no dsVariant required)
Wheel scrolling not workingEnsure the container uses overflow: "scroll" and content exceeds viewport size

© RtlZeroMemory, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .codex/skills/rezi-debug-rendering of RtlZeroMemory/Rezi.

Open the folder on GitHubat commit 671a8a2

Compare with similar skills

Rezi Debug Rendering next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Rezi Debug Rendering compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Rezi Debug Rendering this skillRtlZeroMemory/Rezi675—~991Automated safety check: PassApache-2.0
Trellis Session Insightmindfold-ai/Trellis15k4 repos~1.7kAutomated safety check: PassAGPL-3.0
Native Data FetchingCherryHQ/cherry-studio-app4k6 repos~2.9kAutomated safety check: NotesMIT
Debugging Executionsn8n-io/n8n207k—~2.6kAutomated safety check: PassCustom licence
Aoti Debugpytorch/pytorch104k1 repos~1.7kAutomated safety check: PassCustom licence
Herdr Throwaway Reproductionherdrdev/herdr43k—~2.4kAutomated safety check: PassApache-2.0

Similar skills

  • Trellis Session Insight

    mindfold-ai/Trellis

    Reach into past AI conversation history through the trellis mem CLI.

    15k GitHub starsUsed in 4 repos~1.7k tokens
    DevelopmentAuto-check passed
  • Native Data Fetching

    CherryHQ/cherry-studio-app

    A skill your agent uses when implementing or debugging ANY network request, API call, or data fetching.

    4k GitHub starsUsed in 6 repos~2.9k tokens
    DevelopmentAuto-check: notes
  • Official

    Debug failed or wrong-output workflow executions using executions tools.

    207k GitHub stars~2.6k tokensUpdated today
    DevelopmentAuto-check passed
  • Aoti Debug

    pytorch/pytorch

    Debug AOTInductor (AOTI) errors and crashes. An agent skill from pytorch/pytorch.

    104k GitHub starsUsed in 1 repo~1.7k tokens
    DevelopmentAuto-check passed
  • Runs a disposable, uniquely named Herdr session inside an existing one so runtime, pane, terminal or API bugs can be reproduced without touching the main session.

    43k GitHub stars~2.4k tokensUpdated today
    DevelopmentAuto-check passed
  • Systematic Debugging

    ultralisp/ultralisp

    A skill your agent uses when encountering any bug, test failure, or unexpected behavior, before proposing fixes

    258 GitHub starsUsed in 51 repos~2.4k tokens
    DevelopmentAuto-check passed

More from RtlZeroMemory/Rezi

All 10 skills in this repo
  • Rezi Add Widget

    RtlZeroMemory/Rezi

    Add a new widget type to the Rezi framework. An agent skill from RtlZeroMemory/Rezi.

    675 GitHub stars~815 tokensUpdated 3 mo ago
    Auto-check passed
  • Rezi Create Screen

    RtlZeroMemory/Rezi

    Create a new screen/page for a Rezi TUI application. An agent skill from RtlZeroMemory/Rezi.

    675 GitHub stars~982 tokensUpdated 3 mo ago
    Auto-check passed
  • Rezi Data Table

    RtlZeroMemory/Rezi

    Add a data table with sorting, selection, and keyboard navigation.

    675 GitHub stars~480 tokensUpdated 3 mo ago
    Auto-check passed
  • Rezi Forms

    RtlZeroMemory/Rezi

    Set up form input handling with validation and submission. An agent skill from RtlZeroMemory/Rezi.

    675 GitHub stars~831 tokensUpdated 3 mo ago
    Auto-check passed
  • Rezi Keybindings

    RtlZeroMemory/Rezi

    Set up keyboard shortcuts and chord bindings for a Rezi app.

    675 GitHub stars~497 tokensUpdated 3 mo ago
    Auto-check passed
  • Rezi Modal Dialogs

    RtlZeroMemory/Rezi

    Add modal dialogs and overlay UI with focus trapping. An agent skill from RtlZeroMemory/Rezi.

    675 GitHub stars~731 tokensUpdated 3 mo ago
    Auto-check passed

Categories

Questions about Rezi Debug Rendering

What does Rezi Debug Rendering do?

Debug rendering and layout issues in Rezi apps. An agent skill from RtlZeroMemory/Rezi. Rezi Debug Rendering is an agent skill from RtlZeroMemory/Rezi. Debug rendering and layout issues in Rezi apps.

When should I use Rezi Debug Rendering?

Rezi Debug Rendering fits situations like: has layout problems; renders unexpectedly.

How do I install Rezi Debug Rendering in Claude Code?

Run `npx skills add RtlZeroMemory/Rezi --skill rezi-debug-rendering -a claude-code`. Or copy the skill folder (.codex/skills/rezi-debug-rendering in RtlZeroMemory/Rezi) into .claude/skills/rezi-debug-rendering in your project. Claude Code loads it when a task matches its description.

How do I install Rezi Debug Rendering in Codex?

Run `npx skills add RtlZeroMemory/Rezi --skill rezi-debug-rendering -a codex`. Or copy the skill folder (.codex/skills/rezi-debug-rendering in RtlZeroMemory/Rezi) into .agents/skills/rezi-debug-rendering in your project. Codex loads it when a task matches its description.

Can I use Rezi Debug Rendering in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add RtlZeroMemory/Rezi --skill rezi-debug-rendering -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/rezi-debug-rendering, .gemini/skills/rezi-debug-rendering, .github/skills/rezi-debug-rendering and .opencode/skills/rezi-debug-rendering in your project.

What does Rezi Debug Rendering need to run?

Going by SKILL.md and its folder, Rezi Debug Rendering needs the command-line tools its instructions call (node) and credentials named ZRUI_DUPLICATE_KEY. Our summary lists: A credential in ZRUI_DUPLICATE_KEY. Its frontmatter pre-approves these tools: Read, Glob, Grep, Bash(REZI_PERF=1 *).

Does Rezi Debug Rendering access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Rezi Debug Rendering safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Rezi Debug Rendering use?

Rezi Debug Rendering is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Rezi Debug Rendering use?

About 991 tokens (SKILL.md is roughly 4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Rezi Debug Rendering?

Skills that share tags, products or a category with Rezi Debug Rendering: Trellis Session Insight (mindfold-ai/Trellis, 15k stars), Native Data Fetching (CherryHQ/cherry-studio-app, 4k stars), Debugging Executions (n8n-io/n8n, 207k stars) and Aoti Debug (pytorch/pytorch, 104k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Rezi Debug Rendering?

RtlZeroMemory (a GitHub user) maintains it in RtlZeroMemory/Rezi, which has 675 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on June 17, 2026.

Source: RtlZeroMemory/Rezi on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.