lazy-loading

Use when auditing slow page loads, heavy assets, or rendering delays related to Implement lazy loading for offscreen content. Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes. Absence of `loading='lazy'` is not enough by itself when fold position is unknown.

Quality

78%

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/lazy-loading/SKILL.md

Quality

Content

57%

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

A compact, well-structured overview that correctly defers detail to references/rule.md and includes useful guardrails against false positives. Its weaknesses are instructional rather than executable guidance in the body and the absence of an explicit verification checkpoint inline.

Suggestions

Drop or merge the opening concept sentence with the redundant "Explain" section to remove explanation Claude already knows and save tokens.

Add one small inline executable snippet (e.g. a native loading='lazy' img/iframe example) so the body is actionable without forcing a jump to the reference, and replace "JavaScript solutions" with a concrete pointer.

Add an explicit verification checkpoint to the workflow (e.g. confirm offscreen placement via DevTools/Lighthouse before reporting, then re-measure LCP after the fix) rather than leaving it implied.

Dimension	Reasoning	Score
Conciseness	The body is mostly lean, but the opening concept sentence ("Lazy loading defers non-critical resources until needed—this reduces initial page weight, speeds up first paint...") explains a concept Claude already knows, and the "Explain" section restates that same idea, so it could be tightened.	2 / 3
Actionability	Quick Reference gives concrete attributes (loading='lazy', Intersection Observer) but the body offers no executable code and the Fix section is vague ("JavaScript solutions"); copy-paste-ready examples live only in references/rule.md rather than inline.	2 / 3
Workflow Clarity	Check/Fix/Explain/Code Review sections provide a loose sequence and a guardrail ("do not invent a lazy-loading defect"), but there is no explicit validation/measurement checkpoint in the body — the verify step is only implied and detailed in the reference file.	2 / 3
Progressive Disclosure	A well-organized overview (Quick Reference, Check, Fix, Explain, Code Review) with a single, clearly signaled one-level-deep reference to references/rule.md, which exists and holds the detailed examples.	3 / 3
	Total	9 / 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.

A strong description that follows the good-example pattern: explicit "Use when" trigger, concrete actions, named tooling, and a guard against false positives. The only blemish is the verbatim embedded title ("related to Implement lazy loading for offscreen content") which reads awkwardly mid-sentence but does not weaken the scored dimensions.

Dimension	Reasoning	Score
Specificity	Names multiple concrete actions — "auditing slow page loads, heavy assets, or rendering delays", "Verify the actual bottleneck in DevTools, Lighthouse, or field data", and "recommending changes" — matching the anchor for listing several specific concrete actions.	3 / 3
Completeness	Opens with an explicit "Use when auditing..." trigger clause and states both what the skill does (verify the real bottleneck before recommending changes) and when to invoke it, satisfying both what and when.	3 / 3
Trigger Term Quality	Natural user-facing terms ("slow page loads", "heavy assets", "rendering delays") plus concrete tooling keywords ("DevTools", "Lighthouse", "loading='lazy'") give good coverage of what a user would actually say.	3 / 3
Distinctiveness Conflict Risk	Anchored to a clear niche — lazy loading for offscreen content — with distinctive triggers (fold position, loading='lazy', LCP) that make confusion with other performance skills unlikely.	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/lazy-loading/SKILL.md
Commit: 48405aa

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