CtrlK
BlogDocsLog inGet started
Tessl Logo

interaction-to-next-paint

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

49

Quality

54%

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/interaction-to-next-paint/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

42%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 lean, well-organized overview that correctly defers implementation detail to references/rule.md, but it duplicates its own Quick Reference in the Fix section, pads with a known-concept intro and a meta Explain section, and offers no executable measurement or fixing steps of its own. Navigation and structure are strong; substance within the body is thin.

Suggestions

Merge the Fix section with the Quick Reference bullets it repeats, and replace it with one concrete technique (e.g., scheduler.yield() or chunked processing) or a pointer to the code examples in references/rule.md.

Make the Check section executable: name the actual procedure (e.g., record a Performance panel interactions trace in Chrome DevTools, or read INP field data in PageSpeed Insights / CrUX) instead of just the tool names.

Add a validation step after Fix — re-measure INP to confirm it is under 200ms before reporting the issue resolved — and drop the "INP replaced FID in 2024" date line and the Explain section, which restate what Claude already knows.

DimensionReasoningScore

Conciseness

Several padded or redundant sections: the intro "INP replaced FID as a Core Web Vital in 2024" explains a concept Claude already knows (with a time-sensitive date outside any deprecated section), the Fix section ("Optimize event handlers, break up long tasks, use web workers for heavy computation") nearly verbatim repeats the Quick Reference bullets, and the Explain section is meta-padding. Not a 1 because the body is short and not a wall of explanation; not a 3 because the duplication and padding are noticeable rather than minor trims.

2 / 5

Actionability

The body gives high-level hints without executable steps: "Measure INP using Chrome DevTools or PageSpeed Insights" names no panel, trace, or procedure, and the Fix guidance ("optimize event handlers", "use web workers") names no concrete technique or code — all executable content is deferred to references/rule.md. Not a 3 because beyond the 200ms threshold and tool names there is nothing in the body Claude could directly execute; not a 1 because tools and a concrete threshold are specified.

2 / 5

Workflow Clarity

The section sequence Check → Fix → Explain → Code Review forms a coherent order, and Check embeds a threshold verification ("Verify interaction responses occur within 200ms"), but there is no post-fix re-measurement or feedback loop and checkpoints are implicit rather than explicit. Not a 4 because no validation step confirms the fix worked; not a 2 because the sequence is clear and the skill is a read-only audit, so the destructive-operation cap does not apply.

3 / 5

Progressive Disclosure

A short, well-sectioned overview with one clearly signaled one-level-deep reference: "For full implementation details, code examples, and framework-specific guidance, see references/rule.md" — and the bundle confirms references/rule.md (257 lines) holds exactly those code examples. Per the simple-skill guidance (under 50 lines, single task), well-organized sections plus this clean pointer earn a 5; nothing that belongs in the reference is inlined.

5 / 5

Total

12

/

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 solid description with an explicit "Use when" trigger clause, concrete trigger phrases, and a named-verification "what". Its main weaknesses are thin capability coverage, missing the "INP" acronym as a trigger term, and broad page-speed triggers that overlap other performance skills.

Suggestions

Add the acronym "INP" and "Core Web Vitals" to the trigger terms — they are the phrases users most naturally say for this topic.

Lead with interaction-specific triggers (e.g., "slow or unresponsive interactions", "interaction latency") rather than the generic "slow page loads, heavy assets" to reduce conflict with sibling performance rules.

State one optimizing capability explicitly (e.g., "break up long tasks and offload heavy computation") so the "what" covers more than verification.

DimensionReasoningScore

Specificity

The description names the domain and one or two concrete actions — "Verify the actual bottleneck in DevTools, Lighthouse, or field data" — but its capability coverage stops at auditing/verifying/recommending; the actual optimization work the skill supports is never named. Not a 4 because most of the sentence is trigger framing rather than a list of specific capabilities.

3 / 5

Completeness

Both parts are explicitly present: "Use when auditing slow page loads, heavy assets, or rendering delays related to Optimize interaction to next paint" (when, with concrete triggers) and "Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes" (what). Not a 5 because the "what" is a single verification behavior; the fixing/optimization capability is only implied, and anchor 5 requires a fully explicit capability statement.

4 / 5

Trigger Term Quality

Good natural keyword coverage: "slow page loads", "heavy assets", "rendering delays", "Optimize interaction to next paint", plus tool names DevTools/Lighthouse. Not a 5 because the acronym "INP" — the term users most often say — plus synonyms like "laggy", "unresponsive interactions", and "Core Web Vitals" are missing.

4 / 5

Distinctiveness Conflict Risk

The scoping to "Optimize interaction to next paint" narrows it, but the leading triggers "auditing slow page loads, heavy assets" are generic performance terms that would equally fire sibling rules (image optimization, LCP, lazy loading). Somewhat specific but real overlap risk with closely related performance skills; not a 4 because the broad page-speed triggers come first.

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.