CtrlK
BlogDocsLog inGet started
Tessl Logo

svg-optimization

Use when reviewing image assets, markup, and CDN or build transforms related to Optimize SVG files. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.

60

Quality

70%

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 ./skills/svg-optimization/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

65%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 short, well-structured overview body with an exemplary progressive-disclosure split to references/rule.md, weakened by a Fix section that names SVGO without a single executable command or config snippet, and by the absence of any verification step despite optimization being an operation that can break batch SVG assets. The three-fold repetition of the size-reduction claim is the only real token waste.

Suggestions

Add one executable anchor to the Fix section (e.g. `npx svgo input.svg -o output.svg` or the preset-default config with removeViewBox disabled) so the body is actionable without opening the reference.

Include a verification checkpoint after the fix step (e.g. 'visually compare optimized output to the original and confirm animations/accessibility attributes survived') since batch optimization can break SVGs; this would also lift the workflow-clarity cap.

Consolidate the size-reduction claim, stated three times (intro, Quick Reference, Explain), into one place and drop the redundant Explain restatement.

DimensionReasoningScore

Conciseness

The body is lean and mostly pointer-style, but the file-size claim is stated three ways — "often cutting file size in half", "reduce SVG file size by 50-80%", and "reduce file sizes by 50-80% without quality loss" — and the "Explain" section largely restates the Quick Reference bullets, so minor trimming would be needed to reach the every-token-earns-its-place anchor; it is well above the verbose anchors because nothing explains concepts Claude would not already know.

4 / 5

Actionability

The Fix section is only a high-level hint ("Optimize SVG files using SVGO or similar tools to reduce file size") with no command, config, or flag in the body itself, which approaches the minimal-guidance anchor at 2; it rises to 'some concrete guidance but incomplete' because it names the tool, states constraints ("Preserve viewBox and accessibility attributes", "Integrate into build process"), and points to references/rule.md which does contain executable SVGO CLI and config examples.

3 / 5

Workflow Clarity

A rough sequence exists through the Check → Fix → Explain → Code Review sections, and the Code Review section adds a reporting step ("Flag exact files or components... describe how to confirm the fix in DevTools"), but no validation checkpoint appears in the body even though batch file optimization can break SVGs — the body never mentions verifying output, capping it at 'sequence present but checkpoints missing or implicit'.

3 / 5

Progressive Disclosure

The split is exactly what the rubric asks for: the body is a concise overview (what/why/check/fix) and all implementation detail — code examples, SVGO config, webpack/Vite integration — is one level deep in a real, clearly signaled reference ("For full implementation details, code examples, and framework-specific guidance, see `references/rule.md`"). The reference exists in the bundle and is a single flat file, so navigation is easy with no nested or buried references.

5 / 5

Total

15

/

20

Passed

Description

75%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 serviceable description with an explicit 'Use when' trigger and four concrete check actions, held back from the top band by awkward grammar ("related to Optimize SVG files" uses a verb phrase as a noun) and by never stating the skill's core optimization action or tooling. Third-person voice is maintained and length is appropriately concise.

DimensionReasoningScore

Specificity

The description lists several concrete review actions — "Check encoded size, rendered size, loading strategy, and above-the-fold impact together" plus "reviewing image assets, markup, and CDN or build transforms" — which places it at the 'several specific actions with minor gaps' anchor rather than score 5, because the core capability (optimizing SVGs with a tool like SVGO) is never named as an action, and rather than score 3 because it goes well beyond 1-2 actions.

4 / 5

Completeness

Both parts are present: the 'when' is explicit ("Use when reviewing image assets, markup, and CDN or build transforms related to Optimize SVG files") and the 'what' is stated ("Check encoded size, rendered size, loading strategy, and above-the-fold impact together"), matching the anchor where both exist but one could be more specific — the 'what' describes a review process with garbled phrasing rather than the skill's actual optimization capability, which keeps it below the fully explicit score-5 example.

4 / 5

Trigger Term Quality

It includes natural terms users would say when reviewing assets — "image assets", "markup", "CDN or build transforms", "SVG files", "above-the-fold impact" — giving good coverage, but common synonyms like ".svg", "vector", "SVGO", or "icon files" are missing, so it falls just short of the comprehensive-synonyms anchor at 5.

4 / 5

Distinctiveness Conflict Risk

The SVG-specific framing ("Optimize SVG files") carves out a clear niche, but broad delivery terms like "loading strategy", "CDN", and "above-the-fold impact" create minor overlap risk with sibling image-performance skills (lazy loading, responsive images, format conversion), fitting the 'mostly distinct; minor overlap risk with closely related skills' anchor.

4 / 5

Total

16

/

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

metadata_version

'metadata.version' is missing

Warning

Total

15

/

16

Passed

Repository
thedaviddias/Front-End-Checklist
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.