editor-perf

Guides performance investigation, benchmarking, and optimization of the Grida Canvas web editor (TypeScript reducer, Immer, React hooks). Use when profiling reducer dispatch cost, diagnosing slow interactions (drag, resize, color change), writing or running editor benchmarks, instrumenting with PerfObserver, or optimizing the JS-side state management pipeline.

Quality

88%

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

Quality

Content

77%

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

A thorough, highly actionable perf skill with concrete commands, code, and a strong validation-gated workflow. Its main weakness is density: the SKILL.md carries reference-grade detail inline that would benefit from being split into supporting files, and a few concepts are restated.

Suggestions

Move the PerfObserver API reference (enable/instrument/read results) and the browser-trace Python reader into a references/ file (e.g. REFERENCES.md), keeping SKILL.md as the overview plus the workflow.

Consolidate the cost-scaling discussion into one place — it is restated in Architecture, the Bench spans section, and the Pitfalls — to cut repetition.

Consider extracting the bottleneck-category and span-reading tables into a companion reference so the core SKILL.md stays scannable.

Dimension	Reasoning	Score
Conciseness	Mostly efficient and assumes Claude's competence (no introductory lectures on what Immer or React are), but the body runs very long with several dense tables and repeated conceptual framing (cost scaling restated across Architecture, Bench, and Pitfalls) that could be trimmed.	2 / 3
Actionability	Concrete, copy-paste-ready commands and code throughout — bench invocations with exact env vars, `perf.start()`/try/finally instrumentation snippets, the Python trace reader, and CPU-profile flags — fully executable rather than pseudocode.	3 / 3
Workflow Clarity	The Verification Workflow is an explicit five-step sequence (Baseline → Implement → Measure → Regression check → Accept) with concrete validation commands per step and a clear acceptance checklist including the regression/batch guardrail.	3 / 3
Progressive Disclosure	No bundle files exist in references/scripts/assets, yet the SKILL.md is a ~490-line monolith with deep inline API/troubleshooting detail (PerfObserver reference, trace reader, bottleneck tables) that a multi-file skill would offload; navigation is section-based but the body itself is overloaded.	2 / 3
	Total	10 / 12 Passed

Description

100%

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 highly specific, third-person description that names concrete actions and pairs them with explicit 'Use when' triggers scoped tightly to the Grida Canvas editor pipeline. It answers both what and when while staying concise and largely free of fluff.

Dimension	Reasoning	Score
Specificity	Multiple concrete actions are listed verbatim — 'profiling reducer dispatch cost', 'diagnosing slow interactions (drag, resize, color change)', 'instrumenting with PerfObserver' — matching the multi-action anchor rather than a single domain mention.	3 / 3
Completeness	Both 'what' (the enumerated actions) and 'when' are answered explicitly via the 'Use when ...' clause with concrete trigger conditions, satisfying the explicit-triggers anchor.	3 / 3
Trigger Term Quality	Natural trigger phrasing users would say ('profiling', 'slow interactions', 'color change', 'optimizing') with the 'Use when ... or ... or' chain covering several real-world framings.	3 / 3
Distinctiveness Conflict Risk	The niche is sharply scoped to the Grida Canvas TS/Immer/React editor pipeline, and the 'when' list (reducer dispatch, Immer, PerfObserver spans) is distinct enough to avoid firing for unrelated skills.	3 / 3
	Total	12 / 12 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: gridaco/grida
Path: .agents/skills/editor-perf/SKILL.md
Commit: 2e0d276

Reviewed: 3 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.