animated-content

Use when auditing slow page loads, heavy assets, or rendering delays related to Convert animated GIFs to video. Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes.

Quality

61%

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 ./skills/animated-content/SKILL.md

Quality

Content

57%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 skill is well-structured as an overview with exemplary progressive disclosure, but its executable substance (conversion commands, measurement methods, code examples) is entirely deferred to the reference, leaving the Check and Fix sections under-specified. Tightening the redundant explanatory prose and adding one concrete inline example (a minimal <video> snippet or an ffmpeg command) would raise both actionability and conciseness.

Suggestions

Inline one minimal executable example in the Fix section (e.g., a 6-line <video autoplay loop muted playsinline> snippet or the ffmpeg GIF-to-MP4 command) so the core action is copy-paste ready without opening the reference.

Make the Check section concrete: specify a threshold (e.g., 'GIFs over ~1 MB or 1s duration') and a measurement method (Lighthouse 'Use video formats for animated content' audit) so the audit step is verifiable.

Cut the 'Explain' section and the restated facts in the intro/Quick Reference that Claude already knows (GIFs are larger than MP4/WebM), keeping only the skill-specific guidance.

Dimension	Reasoning	Score
Conciseness	The body is short and sectioned, but the intro ('Large animated GIFs can significantly increase page weight and consume excessive CPU/memory') and Quick Reference bullets ('GIFs are significantly larger than MP4/WebM') restate performance facts Claude already knows. The 'Explain' section is a meta-instruction that adds little guidance value.	3 / 5
Actionability	The Fix section names concrete attributes ('autoplay, loop, muted, and playsinline') but includes no inline code or conversion command, and the Check section ('Check for large animated GIFs that could be replaced') gives no tool, threshold, or method — the executable details live only in references/rule.md.	3 / 5
Workflow Clarity	A rough sequence exists (Check → Fix → Explain → Code Review), and the Code Review section asks to 'describe the measurement method used to confirm the issue', but the Check step itself has no validation checkpoint — no Lighthouse check, size threshold, or ffmpeg comparison is specified.	3 / 5
Progressive Disclosure	The body is a lean overview with clear section headers and a single well-signaled, one-level-deep pointer ('For full implementation details, code examples, and framework-specific guidance, see references/rule.md') to a real bundle file, matching the appropriate-split pattern.	5 / 5
	Total	14 / 20 Passed

Description

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

The description has an explicit 'Use when...' trigger and decent natural performance keywords, but the rule title 'Convert animated GIFs to video' appears spliced mid-sentence, producing ungrammatical text that obscures the skill's core action. The leading trigger terms are also broad performance phrases shared with other performance skills, creating moderate conflict risk.

Suggestions

Rewrite the description as a grammatical sentence, e.g.: 'Converts large animated GIFs to MP4/WebM video to reduce page weight. Use when auditing slow page loads, heavy assets, or rendering delays involving animated GIFs — verify the actual bottleneck in DevTools, Lighthouse, or field data first.'

Lead with the core action (converting GIFs to video) rather than only the audit context, so the 'what' is explicit.

Add distinct trigger terms — 'animated GIFs', 'MP4', 'WebM', '.gif', 'page weight' — to reduce overlap with generic performance-optimization skills and catch users who name the asset type directly.

Dimension	Reasoning	Score
Specificity	It names the domain (animated GIF to video conversion) and one concrete action ('Verify the actual bottleneck in DevTools, Lighthouse, or field data'), but the mangled phrase 'rendering delays related to Convert animated GIFs to video' breaks the action statement, and the conversion action itself is never stated as a verb phrase. Coverage of what the skill does is incomplete rather than minor-gap, so it sits at the '1-2 concrete actions, not comprehensive' anchor rather than the level above.	3 / 5
Completeness	The 'when' is explicit ('Use when auditing slow page loads, heavy assets, or rendering delays') and a 'what' is present ('Verify the actual bottleneck... before recommending changes' plus the embedded conversion intent), so both halves exist. But the what is grammatically garbled by the pasted rule title, making it less explicit than the anchor-5 pattern; it clearly exceeds anchor 3 where 'when' is only weakly implied.	4 / 5
Trigger Term Quality	Natural performance phrases users would say are present ('slow page loads', 'heavy assets', 'rendering delays') alongside tool names (DevTools, Lighthouse) and the GIF/video terms. A few natural synonyms are missing — no 'page weight', 'MP4', 'WebM', or '.gif' extension — which fits 'good keyword coverage; a few natural terms missing' rather than comprehensive coverage.	4 / 5
Distinctiveness Conflict Risk	The opening triggers ('slow page loads', 'heavy assets', 'rendering delays') are generic performance-audit terms that overlap with sibling image-optimization and lazy-loading skills, though the GIF/video and Lighthouse specifics narrow it. This matches 'somewhat specific but could still overlap with similar skills' rather than 'mostly distinct'.	3 / 5
	Total	14 / 20 Passed

Validation

93%

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 — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
metadata_version	'metadata.version' is missing	Warning

	Total	15 / 16 Passed

Repository: thedaviddias/Front-End-Checklist
Path: skills/animated-content/SKILL.md
Commit: 7bfd868

Reviewed: 1 day 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.