first-contentful-paint

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

Quality

66%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/first-contentful-paint/SKILL.md

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 clean overview-style skill body that delegates detail to a real one-level reference, giving excellent progressive disclosure. Weaker spots are repeated conceptual explanation, no in-body executable code, and an implicit rather than explicit measure→fix→re-measure validation loop.

Suggestions

Add an explicit validation checkpoint in the workflow: after applying a Fix, re-measure FCP in Lighthouse/DevTools to confirm the improvement before declaring the issue resolved.

Trim the "Explain" section and the opening definition paragraph — Claude already knows what FCP is; keep only the action-oriented content.

Inline one minimal executable snippet (e.g., a web-vitals onFCP measurement or a defer/preconnect head tag) so the body is actionable without requiring the reference file.

Dimension	Reasoning	Score
Conciseness	Mostly efficient with clear sections, but the opening "FCP is the first visual signal..." and the meta "Explain how FCP measures..." section restate concepts Claude already knows, and the 1.8s target is repeated across Quick Reference, Check, and the body intro.	3 / 5
Actionability	Names concrete techniques (inline critical CSS, preconnect, defer JS) and measurement tools (Lighthouse, PageSpeed Insights), but the body itself contains no executable code — all copy-paste examples are deferred to references/rule.md, leaving key details inline-missing.	3 / 5
Workflow Clarity	A rough measure-then-fix-then-review sequence is implied across Check, Fix, and Code Review, and the description stresses verifying before recommending, but there is no explicit re-measure checkpoint to confirm an optimization actually improved FCP.	3 / 5
Progressive Disclosure	The body is a concise overview with a single clearly signaled, one-level-deep pointer to references/rule.md (verified to exist) for full code examples and framework guidance, splitting content appropriately and making navigation easy.	5 / 5
	Total	14 / 20 Passed

Description

75%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 well-structured description with an explicit trigger clause and concrete tooling, covering both what and when. It is held back from a top score by slightly implicit action coverage and minor overlap with adjacent web-vitals skills.

Dimension	Reasoning	Score
Specificity	Names several concrete actions — "auditing slow page loads, heavy assets, or rendering delays" and "Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes" — with specific tools, though coverage of the optimization actions themselves is implied rather than enumerated.	4 / 5
Completeness	Provides an explicit "Use when..." clause (the when) and a second sentence stating the what (verify bottleneck before recommending changes); the what leans partly on the echoed title phrase rather than standing fully on its own.	4 / 5
Trigger Term Quality	Includes natural user phrases like "slow page loads", "heavy assets", and "rendering delays" alongside tool names (DevTools, Lighthouse), but omits common synonyms like "FCP" or "first contentful paint" as triggers.	4 / 5
Distinctiveness Conflict Risk	The FCP niche is specific with distinct page-load triggers, but it risks minor overlap with sibling Core Web Vitals skills (LCP, CLS, overall performance auditing).	4 / 5
	Total	16 / 20 Passed

Validation

93%

Warnings & errors only

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

Criteria	Description	Result
metadata_version	'metadata.version' is missing	Warning

	Total	15 / 16 Passed

Repository: thedaviddias/Front-End-Checklist
Path: skills/first-contentful-paint/SKILL.md
Commit: 30756a7

Reviewed: 23 days ago

Table of Contents

Discovery Implementation Validation

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.