CtrlK
BlogDocsLog inGet started
Tessl Logo

resource-hints

Use when auditing slow page loads, heavy assets, or rendering delays related to Use resource hints for faster loading. Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes.

56

Quality

65%

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/resource-hints/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.

The body is a well-structured, token-efficient overview with exemplary progressive disclosure to a real one-level reference file. Its main gaps are instructional: it relies on the reference file for all executable detail (no inline snippet of hint syntax) and its Check/Fix flow lacks a post-fix verification step.

Suggestions

Inline one minimal copy-paste example (e.g. a `<link rel="preload" href="/fonts/inter-latin.woff2" as="font" type="font/woff2" crossorigin>` snippet) so the Fix section is actionable without opening the reference file.

Add an explicit post-fix validation step, such as re-running Lighthouse or checking the Network/Waterfall panel to confirm the hint fires and LCP improves.

Drop or compress the "Explain" section, which asks Claude to describe differences it already knows, into a one-line pointer to the reference.

DimensionReasoningScore

Conciseness

The ~33-line body is lean: a Quick Reference of four one-line hint mappings, short Check/Fix sections, and a pointer to the reference file, with no tutorial padding about what resource hints are. Not a 5 because sections like "Explain the differences between preload, prefetch, preconnect, and dns-prefetch" restate knowledge Claude already has and the "Check" line duplicates the title's instruction.

4 / 5

Actionability

The Quick Reference gives concrete mappings ("Use preload for critical above-the-fold resources (fonts, hero images)", "Use preconnect for third-party origins") but the body contains no executable code or syntax — e.g. "Add appropriate resource hints (preload, prefetch, preconnect) for critical assets" is a high-level instruction, with the actual HTML examples deferred entirely to references/rule.md. This sits between anchors 2 and 4: useful concrete guidance, but incomplete on its own.

3 / 5

Workflow Clarity

A rough sequence exists via the Check → Fix → Explain → Code Review sections, and the Code Review section asks to "describe the measurement method used to confirm the issue". But validation checkpoints are implicit: there is no verify-after-fix step (e.g. re-measure LCP or confirm hints render in the Network panel), matching anchor 3 rather than 4.

3 / 5

Progressive Disclosure

The body is a concise overview that defers full implementation details, code examples, and framework guidance to a single clearly signaled one-level-deep reference ("see `references/rule.md`"), and that file exists and contains the promised code examples. This matches the anchor for a clear overview with well-signaled, appropriately split content.

5 / 5

Total

15

/

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 and well-formed 'Use when' clause plus a useful verification guardrail, which puts it above average. Its weaknesses are the template artifact "related to Use resource hints for faster loading" that garbles the 'what', and trigger terms that are broad performance language rather than hint-specific vocabulary.

Suggestions

Rewrite the broken splice into a third-person capability statement, e.g. "Audits and adds resource hints (preload, preconnect, prefetch, dns-prefetch) to speed up page loading. Use when auditing slow page loads, heavy assets, or rendering delays."

Add hint-specific trigger terms such as "preload", "preconnect", "prefetch", "Core Web Vitals", or "LCP" to reduce overlap with sibling performance skills and improve distinctiveness.

State the concrete actions the skill performs (add hints to HTML, verify bottleneck in DevTools/Lighthouse, review routes/assets) instead of relying on the pasted rule title.

DimensionReasoningScore

Specificity

The description names the domain ("resource hints", "slow page loads") and one concrete action ("Verify the actual bottleneck in DevTools, Lighthouse, or field data"), but the core capability is only implied via the pasted title "Use resource hints for faster loading" rather than listed as specific actions. It does not reach anchor 4 because it never states several concrete actions like adding preload/preconnect/prefetch hints.

3 / 5

Completeness

Both elements are present: an explicit when-clause ("Use when auditing slow page loads, heavy assets, or rendering delays") and a what ("Use resource hints for faster loading... Verify the actual bottleneck... before recommending changes"). Not a 5 because the 'what' is a garbled title splice ("delays related to Use resource hints for faster loading") rather than clearly enumerated capabilities.

4 / 5

Trigger Term Quality

Natural trigger phrases like "auditing slow page loads", "heavy assets", "rendering delays", and tool names ("DevTools", "Lighthouse") are present and would be said by users. Not a 5 because common synonyms such as "page speed", "Core Web Vitals", "LCP", or hint names like "preload"/"preconnect" are missing.

4 / 5

Distinctiveness Conflict Risk

The niche (resource hints for page-load performance) is somewhat specific, but the leading triggers "slow page loads", "heavy assets", and "rendering delays" are generic web-performance terms that would equally fire sibling performance skills (image optimization, lazy loading, bundling). Not a 4 because only the embedded title distinguishes it, not the trigger phrases themselves.

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.