CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

optimize

Diagnoses and fixes UI performance across loading speed, rendering, animations, images, and bundle size. Use when the user mentions slow, laggy, janky, performance, bundle size, load time, or wants a faster, smoother experience.

62

Quality

78%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./templates/skills/impeccable/optimize/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

63%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.

The body is well-organized and actionably concrete, with executable code and an assess-optimize-verify flow including validation. Its weaknesses are token efficiency — it restates widely known best practices with duplicated Core Web Vitals coverage across three sections — and the absence of any progressive disclosure: everything is inlined in one long file.

Suggestions

Move detailed, framework-specific, and monitoring content (React tips, Core Web Vitals thresholds, tool list) into reference files (e.g., references/cwv.md, references/frameworks.md) and keep SKILL.md as a lean overview with clearly signaled links, enabling progressive disclosure and cutting the inline size roughly in half.

Remove duplicated material: Core Web Vitals appear in the Assess section, the dedicated 'Core Web Vitals Optimization' section, and the 'Performance Monitoring' section — consolidate into one, keeping only the bottleneck-identification checklist in the assessment phase.

Trim explanations of concepts Claude already knows (why transform/opacity beats layout properties, why 3000px images for 300px displays are wasteful, what font-display does) down to bare directives, keeping only the non-obvious specifics like thresholds and gotchas.

DimensionReasoningScore

Conciseness

The body is mostly terse bullets rather than padded prose, but ~260 lines largely restate web-performance knowledge Claude already has (GPU-accelerated transform/opacity, code splitting, font-display, layout thrashing) and repeat content — Core Web Vitals appear in the Assess section, the dedicated CWV section, and the Monitoring section, and image guidance appears under both Loading and LCP. This fits the 3 anchor ('mostly efficient but includes some unnecessary explanation or could be tightened'); it does not reach 2 because there is no verbose concept explanation, but 4 is blocked by the duplication and encyclopedic coverage of known basics.

3 / 5

Actionability

Includes concrete, executable code for common cases (img srcset/sizes, lazy dynamic import, batched reads/writes, @font-face with unicode-range, IntersectionObserver, aspect-ratio) plus specific thresholds (LCP < 2.5s, 16ms/60fps, CLS < 0.1). It is not a 5 because many sections are hint-level bullets without executable specifics ('Use CDN for faster delivery', 'Use web workers for heavy computation', 'Server-side rendering'); it clearly exceeds the 3 anchor's pseudocode/incomplete level.

4 / 5

Workflow Clarity

The sequence is clear — assess/measure ('CRITICAL: Measure before and after'), identify bottlenecks with diagnostic questions, optimize by category, then a dedicated 'Verify Improvements' section with before/after metrics, device/connection testing, and 'No regressions: Ensure functionality still works' as a validation checkpoint. It falls short of 5 because the phases are signaled by headings rather than an explicit ordered procedure, and there is no feedback loop for 'if no improvement, revisit the next bottleneck'; it exceeds the 3 anchor because validation checkpoints are explicitly present.

4 / 5

Progressive Disclosure

The body has good section structure but is a ~260-line monolith with no references/, scripts/, or assets/ files at all — content that clearly belongs in separate files (React-specific tips, Core Web Vitals thresholds, monitoring tool list) is fully inlined. This matches the 3 anchor ('some structure... content that should be separate is inline'); the under-50-lines exception for a 5 does not apply, and 4 is unreachable without any external references or splitting.

3 / 5

Total

14

/

20

Passed

Description

83%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 description that clearly states what the skill does and when to use it, with natural trigger terms users would actually say. Minor improvements are possible in action verb variety and in disambiguating generic terms like 'performance' from non-UI contexts.

DimensionReasoningScore

Specificity

The description lists two concrete actions ('Diagnoses and fixes UI performance') across five named domains ('loading speed, rendering, animations, images, and bundle size'), matching the anchor for several specific actions with minor gaps. It falls short of a 5 because only two verbs are used — the domain list carries the specificity rather than a fuller set of distinct actions — but it clearly exceeds the 3 anchor's '1-2 concrete actions' with its comprehensive domain coverage.

4 / 5

Completeness

It explicitly answers both questions with concrete trigger phrases: 'Diagnoses and fixes UI performance across...' states the what, and 'Use when the user mentions slow, laggy, janky, performance...' gives an explicit when-clause. This matches the top anchor exactly; the 4 anchor's 'when could be more explicit' does not apply here.

5 / 5

Trigger Term Quality

Strong natural-language triggers: 'slow, laggy, janky, performance, bundle size, load time' and 'wants a faster, smoother experience' — phrases users genuinely say. It is not a 5 because common variations like 'stuttering', 'freezes', 'FPS', 'memory/CPU usage', or 'optimization' are absent; it sits comfortably above the 3 anchor's 'missing common variations'.

4 / 5

Distinctiveness Conflict Risk

The UI-performance niche is clear and terms like 'janky', 'laggy', and 'smoother' are distinctively frontend. It is not a 5 because generic trigger words 'slow' and 'performance' could also match non-UI skills (backend, database, API optimization), creating minor overlap risk with closely related skills.

4 / 5

Total

17

/

20

Passed

Validation

93%

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

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository

fengshao1227/ccg-workflow

Path

templates/skills/impeccable/optimize/SKILL.md

Reviewed

Table of Contents

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.