CtrlK
BlogDocsLog inGet started
Tessl Logo
PluginPublic

testland/web-vitals-inp-deep

Use when a page feels slow to respond while LCP and CLS are green, or key interactions (form submit, modal open, route change) need an INP budget in CI. Breaks Interaction to Next Paint into input delay, processing and presentation, asserts per-interaction budgets in Playwright and finds long tasks.

Quality

87%

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

Overview
Quality
Evals
Security
Files

Quality

Content

81%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.

High-quality content: a clearly sequenced six-step workflow with executable, gotcha-aware Playwright code, an anti-patterns recovery table, and well-signaled external references. The main deductions are repeated citation filler, the https://localhost:3000 scheme bug, and an entirely single-file layout with no progressive split.

Suggestions

Trim the repeated "Per the [INP web.dev article]" filler sentences (it appears five times, including as a standalone line after Step 1) and cite once where each fact is non-obvious.

Change "https://localhost:3000" to "http://localhost:3000" in both Playwright tests so they run copy-paste against a typical dev server.

Move the CrUX query details and LoAF discussion into a references/ file (e.g. FIELD-DATA.md) linked from a short section, aligning Step 4's single-sample Math.max assertion with the anti-pattern guidance to run N iterations and assert P75.

DimensionReasoningScore

Conciseness

The body is lean and code-forward with only minor trimmable padding: "Per the [INP web.dev article]" is repeated as a standalone filler sentence (e.g. directly after Step 1) and the opening quoted INP definition restates what Claude largely knows. Fits anchor 4 (minor over-explanation) rather than 5 (every token earning its place).

4 / 5

Actionability

Guidance is nearly fully executable — complete Playwright tests with real gotcha handling (visibilityState redefine-before-dispatch, buffered longtask observer, guarded LoAF) and a runnable CrUX curl. Both tests target "https://localhost:3000", which fails against a typical plain-HTTP dev server, a minor executable gap that keeps it at anchor 4 rather than 5.

4 / 5

Workflow Clarity

Steps 1–6 are clearly sequenced (install → lab measure → decompose → CI assert → find blockers → field correlate), each Playwright step embeds an explicit validation assertion, and the Anti-patterns table plus "Lab passing + field failing = sample population mismatch" provide failure-mode → fix recovery guidance. No destructive or batch operations apply a cap.

5 / 5

Progressive Disclosure

Sections are well organized and a References section clearly signals five one-level-deep external sources with what each provides, but there is no bundle split at all — everything is inline in a ~200-line file (the under-50-line exception doesn't apply), and detail like the CrUX/LoAF material could live in a reference file. Anchor 4 fits best.

4 / 5

Total

17

/

20

Passed

Description

87%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 strong description: explicit when-triggers with concrete scenarios, specific third-person capability verbs, and a well-differentiated niche. The only gaps are the omitted CrUX/field-data capability and a few missing natural synonyms like "web vitals".

DimensionReasoningScore

Specificity

"Breaks Interaction to Next Paint into input delay, processing and presentation", "asserts per-interaction budgets in Playwright" and "finds long tasks" are three concrete, third-person actions, but CrUX field-data correlation (a full step of the skill) is uncovered — a minor coverage gap matching anchor 4 rather than comprehensive anchor 5.

4 / 5

Completeness

It opens with an explicit "Use when..." clause containing two concrete trigger scenarios (feels-slow with green LCP/CLS; CI interaction budgets) and separately states what it does via concrete third-person verbs, clearly matching the anchor-5 example structure.

5 / 5

Trigger Term Quality

Natural user phrases like "page feels slow to respond", "LCP and CLS are green", "form submit, modal open, route change" and "INP budget in CI" are present, but common synonyms such as "web vitals" or "Core Web Vitals" that a user would naturally say are missing, so coverage is good rather than comprehensive.

4 / 5

Distinctiveness Conflict Risk

The "while LCP and CLS are green" qualifier carves out a distinct INP-only niche and disambiguates from LCP/CLS web-vitals skills, giving clear triggers with minimal conflict risk.

5 / 5

Total

18

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Reviewed

On this page