CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

fixing-motion-performance

Audit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects. Use when animations stutter, transitions jank, or reviewing CSS/JS animation performance.

Quality

82%

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

SKILL.md
Quality
Evals
Security

Quality

Content

75%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 content is a compact, well-organized rule catalog with concrete before/after code and a clear dual-mode usage contract. It consistently lands at 'good with minor gaps': slight duplication between the priority table and section headers, a few abstract rules lacking named tools, and no verification loop for the fix workflow.

Suggestions

Merge the 'rule categories by priority' table into the quick-reference section headers (e.g., '### 1. never patterns (critical)') and drop the separate table plus the rendering-steps glossary to remove duplication and assumed-knowledge content.

Name concrete tools where guidance is currently abstract — e.g., replace 'validate layer behavior with tooling' with a specific Chrome DevTools Layers/Performance panel check.

Add a short verification step to the fix workflow (e.g., re-check the animation in the browser profiler or confirm no long tasks/layout shifts after applying the fix) so fixes include a feedback loop.

DimensionReasoningScore

Conciseness

The body is lean and directive (terse bullets like "do not interleave layout reads and writes in the same frame", "keep blur animation small (<=8px)"), fitting 'efficient; minor instances of over-explanation that could be trimmed'. Not a 5 because the rendering-steps glossary states concepts Claude already knows and the rule-category table duplicates the quick-reference section headers.

4 / 5

Actionability

Concrete rules plus executable before/after snippets ("transition: transform 0.3s", the FLIP batching example, "animation-timeline: view()") cover the common cases, matching 'mostly executable guidance; concrete code with minor gaps'. Not a 5 because some guidance stays abstract ("validate layer behavior with tooling" names no tool) and the scroll-timeline example references an undefined fade-in keyframe.

4 / 5

Workflow Clarity

The 'how to use' section defines both invocation modes unambiguously, and 'review guidance' sequences enforcement ("enforce critical rules first") with a concrete report format (quote, why, fix). Not a 5 because the fix-apply mode has no procedural steps and no verification checkpoint for confirming a fix resolved the jank.

4 / 5

Progressive Disclosure

A single self-contained file with well-organized sections and no buried or nested references; no references/ or scripts/ bundle exists, so nothing is mis-filed. Not a 5 because at ~150 lines the quick-reference rule catalog could arguably be split into a reference file with SKILL.md as a lean overview, and the glossary/priority table are minor organization redundancies.

4 / 5

Total

16

/

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: it clearly states what the skill does, enumerates concrete issue areas, and provides explicit natural-language triggers with synonyms. Remaining gaps are coverage of a few problem areas and common trigger variations (laggy, frame drops, library names).

DimensionReasoningScore

Specificity

"Audit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects" names the domain plus four concrete issue categories, matching the 'several specific actions; minor gaps' anchor. Not a 5 because only two distinct actions (audit, fix) are listed and coverage omits known problem areas like rAF loops, will-change/layering, and measurement batching.

4 / 5

Completeness

The description explicitly answers 'what' ("Audit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects") and 'when' ("Use when animations stutter, transitions jank, or reviewing CSS/JS animation performance"), mirroring the anchor-5 pattern of concrete actions followed by explicit trigger phrases.

5 / 5

Trigger Term Quality

"Use when animations stutter, transitions jank, or reviewing CSS/JS animation performance" includes natural user phrasings with synonyms (stutter/jank), which fits 'good keyword coverage; a few natural terms missing'. Not a 5 because common variations users would say — laggy, frame drops, FPS, library names like GSAP or Framer Motion — are absent.

4 / 5

Distinctiveness Conflict Risk

The animation-performance niche with distinct triggers (stutter, jank, layout thrashing, scroll-linked motion) is mostly distinct from other skills, matching 'mostly distinct; minor overlap risk'. Not a 5 because there is minor overlap risk with a closely related general web-performance or CSS-optimization skill given phrases like 'reviewing CSS/JS animation performance'.

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

administrakt0r/AI-Agents-Safe-Coding-Skills

Path

skills/fixing-motion-performance/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.