CtrlK
BlogDocsLog inGet started
Tessl Logo

css-minification

Use when reviewing stylesheets, component styles, and responsive behavior related to Minify all CSS files. Check the rendered layout across breakpoints and interaction states before proposing a fix.

55

Quality

62%

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/css-minification/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

57%

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-structured and uses progressive disclosure effectively, pointing to a real, substantive reference file. It is held back by a redundant Explain section, no inline executable code/config, and the absence of a concrete verification checkpoint in the workflow.

Suggestions

Remove the redundant 'Explain' section and tighten the opening line — Claude already knows what CSS minification is, so the premise restates a known concept.

Add one inline executable snippet (e.g., a cssnano PostCSS config or a Vite build config) instead of only naming tools and deferring all code to the reference.

Add an explicit verification checkpoint, e.g., 'After minifying, confirm the production build's CSS has no whitespace/comments and that the rendered layout still passes at each breakpoint.'

DimensionReasoningScore

Conciseness

The Quick Reference is lean and useful, but the opening line 'Unminified CSS wastes bandwidth with whitespace, comments, and verbose syntax—minification delivers the same styles in significantly fewer bytes' explains a concept Claude already knows, and the 'Explain' section restates the same premise ('reduces file sizes, decreasing bandwidth usage, and speeding up page load times'). Not 3 because of redundant/known-concept content; not 1 because the rest is efficient rather than a verbose wall of basics.

2 / 3

Actionability

Names concrete tools ('cssnano', 'lightningcss', 'CleanCSS', 'Vite, webpack', 'Gzip/Brotli') and a clear process, but provides no inline executable commands or config snippets (no vite.config or PostCSS config), deferring all code to references/rule.md. Not 3 because nothing in the body is copy-paste ready; not 1 because the guidance is concrete and actionable, not vague.

2 / 3

Workflow Clarity

The Check → Fix → Explain → Code Review sections give structure, but 'Verify that all CSS files are minified in production' states a check with no concrete verification method, and there is no explicit validation checkpoint or feedback loop (e.g., confirm minified output renders correctly across breakpoints). Not 3 because validation checkpoints are missing/implicit; not 1 because steps are present and the single task is unambiguous.

2 / 3

Progressive Disclosure

The body is a concise overview with well-organized sections and a clearly signaled one-level-deep reference — 'see references/rule.md' — which was verified to exist (702 lines, containing code examples). Not 2 because the reference is clearly signaled and content is appropriately split (overview inline, full details in the reference), matching the clear-overview-with-one-level-deep-references anchor.

3 / 3

Total

9

/

12

Passed

Description

67%

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 answers both what and when with an explicit 'Use when' trigger, but it frames the skill around reviewing responsive behavior rather than the core minification task, weakening specificity, natural-trigger alignment, and distinctiveness. It is competent but reads more like a CSS-review skill than a CSS-minification skill.

Suggestions

Lead with the concrete skill action (e.g., 'Minify CSS files in the build pipeline') and list distinct operations instead of framing everything as 'reviewing'.

Add natural user phrasings a person would say when needing minification — 'minify my CSS', 'reduce CSS file size', 'site is slow / improve page load' — rather than leading with 'reviewing responsive behavior'.

Narrow the trigger to CSS performance/minification specifically (e.g., 'Use when optimizing CSS delivery or minifying stylesheets') to avoid overlapping with general CSS-review or responsive-design skills.

DimensionReasoningScore

Specificity

Quotes 'reviewing stylesheets, component styles, and responsive behavior', 'Check the rendered layout across breakpoints and interaction states', and 'before proposing a fix' — it names the CSS domain and several review/check actions, matching the 'names domain and some actions, but not comprehensive' anchor. Not 3 because the actions are variations of reviewing rather than a list of distinct concrete operations like extract/fill/merge; not 1 because it is concrete, not vague.

2 / 3

Completeness

Opens with an explicit 'Use when reviewing stylesheets, component styles, and responsive behavior related to Minify all CSS files' trigger (the 'when') and states the 'what' (review/check CSS for the minification rule and propose a fix). Not capped at 2 per the guideline because an explicit 'Use when...' trigger is present, and both what and when are answered.

3 / 3

Trigger Term Quality

Includes relevant keywords like 'stylesheets', 'responsive behavior', 'breakpoints', 'interaction states', 'Minify all CSS files', and 'CSS files', but the dominant 'reviewing responsive behavior' framing does not match the phrasing a user naturally says when they need minification. Not 3 because it misses common natural variations ('minify my CSS', 'page load', 'site is slow', 'file size'); not 1 because it does contain natural domain terms rather than pure jargon.

2 / 3

Distinctiveness Conflict Risk

'Minify all CSS files' is a clear niche, but the trigger 'reviewing stylesheets, component styles, and responsive behavior' is broad and would also fire for general CSS-review or responsive-design requests, creating overlap with similar skills. Not 3 because the review/responsive framing is not tightly scoped to minification; not 1 because it is far more specific than 'helps with code and documents'.

2 / 3

Total

9

/

12

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.

Validation15 / 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.