CtrlK
BlogDocsLog inGet started
Tessl Logo

debug-optimize-lcp

Guides debugging and optimizing Largest Contentful Paint (LCP) using Chrome DevTools MCP tools. Use this skill whenever the user asks about LCP performance, slow page loads, Core Web Vitals optimization, or wants to understand why their page's main content takes too long to appear. Also use when the user mentions "largest contentful paint", "page load speed", "CWV", or wants to improve how fast their hero image or main content renders.

81

2.27x
Quality

83%

Does it follow best practices?

Impact

91%

2.27x

Average score across 2 eval scenarios

SecuritybySnyk

Low

Low-risk findings worth noting

SKILL.md
Quality
Evals
Security

Quality

Content

77%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 delivers an exceptionally actionable, well-sequenced debugging workflow with real tool calls, parameters, and a verification loop, backed by an executable snippets file. Its weaknesses are duplicated educational content and the orphaning of three of the four reference files, whose material is inlined rather than delegated.

Suggestions

Trim or cut the 'What is LCP and why it matters' intro and the subparts definition table — Claude already knows LCP thresholds, and the detailed breakdown lives in references/lcp-breakdown.md.

Replace the inlined Optimization Strategies section with a short prioritized summary that links to references/optimization-strategies.md for the full detail, mirroring how lcp-snippets.md is referenced.

Add clearly signaled links to the two unreferenced files (references/elements-and-size.md, references/lcp-breakdown.md) at the points in the workflow where their content applies, so all bundle files are discoverable.

DimensionReasoningScore

Conciseness

The body re-explains concepts Claude already knows ("LCP measures how quickly a page's main content becomes visible", the Good/Needs improvement/Poor thresholds, "LCP is a Core Web Vital that directly affects user experience and search ranking"), and the subparts table plus the ~35-line Optimization Strategies section duplicate material that exists in references/lcp-breakdown.md and references/optimization-strategies.md. This fits anchor 3 ("Mostly efficient but includes some unnecessary explanation or could be tightened"); the tool-specific workflow content itself is efficient, keeping it above anchor 2.

3 / 5

Actionability

Guidance is fully executable: exact MCP tool calls with parameters ("performance_start_trace with pageId, reload: true and autoStop: true"), specific insight names (LCPBreakdown, DocumentLatency, RenderBlocking, LCPDiscovery), concrete network filters ("resourceTypes: [\"Image\", \"Font\"]"), specific fixes (preload with fetchpriority, font-display: swap, "Fast 3G" with cpuThrottlingRate: 4), and the referenced JavaScript snippets in references/lcp-snippets.md are real, complete, and copy-paste ready. Matches anchor 5.

5 / 5

Workflow Clarity

The five-step debugging workflow is explicitly ordered ("Follow these steps in order. Each step builds on the previous one"), each step consumes the previous step's output ("Note the insight set IDs from the output — you'll need them"), conditional outcomes are handled ("If url is empty, the LCP element is text-based"), and the Verifying Fixes section provides an explicit feedback loop ("Re-run the trace... and compare the new subpart breakdown. The bottleneck should shrink"). Matches anchor 5's clear sequence with validation; the operations are non-destructive so no cap applies.

5 / 5

Progressive Disclosure

Scored against the actual bundle: 4 reference files exist, but only references/lcp-snippets.md is ever linked from the body (clearly, twice). elements-and-size.md, lcp-breakdown.md, and optimization-strategies.md are never signaled, and their subject matter (subpart definitions, optimization strategies) is partially inlined in the body instead. This matches anchor 3 ("references present but not clearly signaled; content that should be separate is inline"); the body's clean section structure and the one well-signaled link keep it above anchor 2.

3 / 5

Total

16

/

20

Passed

Description

90%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 with explicit what/when structure and comprehensive, natural trigger coverage including synonyms and the CWV acronym. The main weakness is capability specificity: it states only the general actions of debugging and optimizing rather than naming the concrete activities the skill performs.

Suggestions

List 2-3 concrete capabilities after the opening clause, e.g., 'Records performance traces, analyzes LCP subpart breakdowns, and identifies the LCP element via Chrome DevTools MCP tools' to raise specificity.

Consider mentioning the diagnostic-to-fix workflow shape (trace -> identify bottleneck subpart -> apply targeted fix) so users can tell this skill covers both diagnosis and remediation.

DimensionReasoningScore

Specificity

"Guides debugging and optimizing Largest Contentful Paint (LCP) using Chrome DevTools MCP tools" names the domain and tooling with two actions (debugging, optimizing), but does not list several concrete capabilities (e.g., recording traces, analyzing insights, auditing the DOM). This matches anchor 3 ("Names domain and 1-2 concrete actions, but not comprehensive") and falls short of anchor 4, which expects several specific actions.

3 / 5

Completeness

It explicitly answers what ("Guides debugging and optimizing LCP using Chrome DevTools MCP tools") and when ("Use this skill whenever the user asks about... Also use when the user mentions...") with concrete trigger phrases. This clearly matches anchor 5 rather than anchor 4, whose 'when' clause is less explicit or specific.

5 / 5

Trigger Term Quality

The description covers natural trigger phrases comprehensively: "LCP performance", "slow page loads", "Core Web Vitals optimization", "largest contentful paint", "page load speed", "CWV", and "hero image", including both the spelled-out metric name and its acronym. This matches anchor 5's comprehensive coverage including synonyms; anchor 4 would require noticeably missing natural terms, which is not the case.

5 / 5

Distinctiveness Conflict Risk

The LCP-specific niche ("debugging and optimizing Largest Contentful Paint (LCP) using Chrome DevTools MCP tools") with distinct triggers like "CWV" and "hero image" creates minimal conflict risk with other skills. Matches anchor 5 ("Clear niche with distinct triggers; minimal conflict risk") rather than anchor 4, which implies residual overlap with closely related skills.

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.

Repository
ChromeDevTools/chrome-devtools-mcp
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.