lite-render-perf

Use when working on React code in `apps/lite` that derives values during render, adds or consumes a context, subscribes to the redux store or a query, or renders lists of row components — and whenever the lite UI is reported slow, laggy, or re-rendering too much. React Compiler does not prevent these regressions; load this skill BEFORE writing such code, not only when debugging it.

Quality

78%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./.agents/skills/lite-render-perf/SKILL.md

Quality

Content

82%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A dense, codebase-specific body that assumes competence and delivers highly executable guidance with concrete file precedents and working scripts. Its few weak spots are minor prose tightening opportunities and the choice to keep long scripts inline rather than in reference files.

Dimension	Reasoning	Score
Conciseness	The body assumes Claude knows React/Redux/react-query and avoids generic concept explanation; prose is tied to concrete regressions and named files, though a few explanatory passages could be tightened further.	4 / 5
Actionability	It provides copy-paste-ready code for the common cases — the babel-plugin-react-compiler transform config, the useAppSelector primitive selector, the CDP driver script, and the React DevTools commit logger — plus specific commands (pnpm dev, curl 9222/json, lsof kill).	5 / 5
Workflow Clarity	The 'Measuring' section is a numbered sequence with explicit validation ('prove it, in both directions', 'measure before and after the fix', restore the hook) and a review checklist, but the overall structure is reference-style across three mechanisms rather than one linear workflow.	4 / 5
Progressive Disclosure	No bundle files exist and the skill is a single self-contained document with well-organized section headers (three mechanisms, CDP driving, measuring, checklist); the long inline CDP script and babel snippet could arguably live in reference files, keeping it just below a 5.	4 / 5
	Total	17 / 20 Passed

Description

73%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong, highly targeted trigger description written in third person with concrete code-pattern cues and good natural-language keywords. Its main weakness is that it foregrounds when-to-use so heavily that what the skill actually does remains implied rather than stated.

Suggestions

Lead with a concrete capability clause (e.g. 'Diagnoses and prevents accidental over-re-rendering in apps/lite React code') before the 'Use when' triggers so the 'what' is explicit, not implied.

Add a few more user-natural synonyms (e.g. 'janky', 'frame drops', 'stuttering') alongside 'slow, laggy, or re-rendering too much' to broaden trigger coverage.

Dimension	Reasoning	Score
Specificity	The description names the domain concretely ('React code in apps/lite that derives values during render, adds or consumes a context, subscribes to the redux store or a query, or renders lists of row components') but these are trigger conditions rather than concrete actions the skill performs; the actual capability is only implied via 'these regressions'.	3 / 5
Completeness	It has an explicit and specific 'Use when...' clause covering multiple trigger scenarios, and the 'what' (preventing/diagnosing re-render regressions the React Compiler does not catch) is present but only implied rather than stated as a concrete capability, so it is not a 5.	4 / 5
Trigger Term Quality	Good coverage of natural developer phrasing — 'slow, laggy, or re-rendering too much' plus concrete pattern names (derives values during render, subscribes to the redux store or a query, renders lists of row components); a few synonyms a user might say are still missing.	4 / 5
Distinctiveness Conflict Risk	It carves a clear niche (render-performance regressions specific to the lite React app and the React Compiler's memoization behavior) with distinct triggers and minimal overlap risk with other skills.	5 / 5
	Total	16 / 20 Passed

Validation

100%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository: gitbutlerapp/gitbutler
Path: .agents/skills/lite-render-perf/SKILL.md
Commit: e64149e

Reviewed: 5 days ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.