offscreen-lazy

Use when reviewing image assets, markup, and CDN or build transforms related to Lazy load offscreen images. Check encoded size, rendered size, loading strategy, and above-the-fold impact together. Missing `loading='lazy'` is only a valid finding when you can reasonably tell the image is offscreen or non-critical.

Quality

86%

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

Quality

Content

72%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body is well-structured and actionable with good progressive disclosure via a real reference file, but it leans verbose through concept re-explanation and repeated rationale. Workflow clarity is solid but lacks explicit validation checkpoints.

Suggestions

Trim the "Explain" section's restatement of native lazy-loading mechanics (distance threshold, universal browser support) since Claude already knows this; keep only the LCP caveat and CLS pairing rule.

Remove the duplicated "eliminates unnecessary image downloads" rationale and the repeated LCP warning—state each once in its dedicated section.

Add an explicit validation checkpoint to the Check/Fix flow, e.g. "After fixes, re-scan in DevTools Network tab or rerun Lighthouse to confirm the Defer offscreen images audit passes," to lift workflow clarity above an implicit loop.

Dimension	Reasoning	Score
Conciseness	The body is mostly efficient but the "Explain" section re-explains native lazy loading (the 1250px distance threshold, browser support) that Claude already knows, and the LCP caveat and "eliminates unnecessary image downloads" rationale are repeated across sections, so it could be tightened.	2 / 3
Actionability	Concrete, executable guidance names exact attributes (loading="lazy", fetchpriority="high", width/height) and gives numbered Fix steps specifying what to add, remove, and verify, which is actionable for an instruction-only review skill.	3 / 3
Workflow Clarity	The Check → Fix → Explain → Code Review sequence is clearly ordered, but validation checkpoints are only implied ("confirm the fix in DevTools" appears once) rather than explicit feedback loops, so it sits below the clear-validation anchor.	2 / 3
Progressive Disclosure	The lean, sectioned body points to a real one-level-deep references/rule.md for code examples and framework guidance with a clear pointer, matching the well-signaled one-level-deep-references anchor.	3 / 3
	Total	10 / 12 Passed

Description

100%

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 is specific, trigger-rich, and complete, with an explicit "Use when" clause and concrete review actions. It is tightly scoped to lazy-loading offscreen images with low conflict risk.

Dimension	Reasoning	Score
Specificity	Lists multiple concrete actions—"reviewing image assets, markup, and CDN or build transforms" and "Check encoded size, rendered size, loading strategy, and above-the-fold impact together"—matching the multiple-specific-actions anchor.	3 / 3
Completeness	Explicitly answers both what (review assets/markup/transforms, check size/loading/above-fold) and when via the "Use when reviewing..." trigger clause, matching the both-what-and-when anchor.	3 / 3
Trigger Term Quality	Natural user-facing terms like "image assets, markup," "Lazy load offscreen images," and "loading='lazy'" give good coverage, matching the rubric's natural-terms anchor.	3 / 3
Distinctiveness Conflict Risk	Scoped tightly to offscreen-image lazy loading with the distinctive trigger "Lazy load offscreen images," making it unlikely to fire for unrelated skills.	3 / 3
	Total	12 / 12 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/offscreen-lazy/SKILL.md
Commit: 48405aa

Reviewed: about 8 hours 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.