CtrlK
BlogDocsLog inGet started
Tessl Logo

js-file-size

Use when auditing slow page loads, heavy assets, or rendering delays related to Optimize JavaScript bundle size. Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes.

54

Quality

61%

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/js-file-size/SKILL.md
SKILL.md
Quality
Evals
Security

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.

A lean, well-structured audit skill body with excellent progressive disclosure — one clean pointer to a real references/rule.md carrying the implementation detail. Its weaknesses are inward: known-concept padding and Quick Reference/Check/Fix redundancy in the body, no executable measurement command for the Check step, and no post-fix verification step in the workflow.

Suggestions

Add an explicit verification step after Fix, e.g. 'Verify: re-measure in Lighthouse or DevTools (compressed transfer size) and confirm the targeted bundle is now under 200KB before considering the fix complete.'

Make the Check step executable by naming the measurement method — e.g. webpack-bundle-analyzer, DevTools Coverage tab, or Lighthouse — instead of the bare directive 'Review the JavaScript bundle sizes'.

Deduplicate the body: merge the Quick Reference bullets into Check/Fix (the 200KB rule and code-splitting/tree-shaking are each stated twice) and drop the intro sentence explaining JavaScript parse/execution cost that Claude already knows.

DimensionReasoningScore

Conciseness

The body is short but padded with known material: the intro paragraph ('Excessive JavaScript increases parse and execution time, especially on low-end devices...') and the TTI/FID bullet restate what Claude already knows, and the 200KB threshold plus code-splitting/tree-shaking each appear twice (Quick Reference vs Check/Fix). Mostly efficient, with several trimmable redundancies — the 3 anchor.

3 / 5

Actionability

Concrete anchors exist ('Keep individual JS bundles under 200KB (compressed)', 'exceeding 200KB (Gzip/Brotli)', named techniques), but nothing in the body is executable: 'Review the JavaScript bundle sizes' gives no measurement tool or command, and 'Implement code-splitting, tree-shaking, and dependency audits' gives no steps or configuration. Some concrete guidance, incomplete execution — the 3 anchor.

3 / 5

Workflow Clarity

Check → Fix → Explain → Code Review is a legible sequence, but the only measurement checkpoint is pre-fix ('describe the measurement method used to confirm the issue'); there is no post-fix re-verification step to confirm the bundle is actually under budget. Sequence present, validation checkpoints implicit or missing — the 3 anchor, not 4, because the critical post-fix checkpoint is absent rather than a minor gap.

3 / 5

Progressive Disclosure

The body is a concise overview with clearly labeled sections (Quick Reference, Check, Fix, Explain, Code Review) and a single, well-signaled, one-level-deep pointer: 'For full implementation details, code examples, and framework-specific guidance, see references/rule.md'. The referenced file exists and delivers exactly what is promised (code examples, tools, verification guidance) — matching the 5 anchor's structure.

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.

A serviceable description with an explicit 'Use when' trigger and one genuinely concrete instruction (verify the bottleneck before recommending changes). Its main weaknesses are the awkward title splice 'related to Optimize JavaScript bundle size' in place of a stated capability list, and generic performance triggers that raise overlap risk with other page-speed skills.

Suggestions

Replace the title splice 'related to Optimize JavaScript bundle size' with the skill's concrete actions, e.g. 'Audit JavaScript bundle sizes against a ~200KB compressed budget and apply code-splitting, tree-shaking, and dependency audits to reduce them.'

Add JS-specific trigger synonyms (e.g., 'large JS files', 'bundle bloat', 'JavaScript too heavy', 'Core Web Vitals / INP') so the skill triggers on JS-size phrasing rather than only generic page-speed complaints, reducing overlap with image-optimization or lazy-loading skills.

DimensionReasoningScore

Specificity

The description names the domain and one concrete, tool-specific action ('Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes'), but never states what the skill does beyond that — 'related to Optimize JavaScript bundle size' is a title splice rather than an action list. It is not 4 because only one concrete action is given, and not 2 because that action names real tools rather than generic filler.

3 / 5

Completeness

Both halves are present: an explicit trigger ('Use when auditing slow page loads, heavy assets, or rendering delays...') and a concrete what ('Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes'). Not 5 because the 'what' stops short of naming the optimization work the skill performs (auditing bundle sizes, applying code-splitting/tree-shaking).

4 / 5

Trigger Term Quality

Natural user phrases are present ('slow page loads', 'heavy assets', 'rendering delays') alongside tool keywords (DevTools, Lighthouse, field data). Coverage falls short of the 5 anchor because common synonyms like 'large JS files', 'bundle bloat', or 'JavaScript performance' are missing, but it is well above the 3 anchor's thin keyword set.

4 / 5

Distinctiveness Conflict Risk

'JavaScript bundle size' carves a clear niche, but the leading triggers 'slow page loads' and 'heavy assets' are generic page-performance language that would also fire for sibling skills like image optimization or lazy loading. Somewhat specific, but real overlap risk with closely related performance skills — the 3 anchor.

3 / 5

Total

14

/

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.