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.

1.75x

Quality

87%

Does it follow best practices?

Impact

86%

1.75x

Average score across 3 eval scenarios

Securityby

Advisory

Suggest reviewing before use

Quality

Discovery

89%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

This is a strong skill description with excellent trigger term coverage and completeness, clearly specifying both what the skill does and when to use it. The main weakness is that the capability description could be more specific about the concrete actions performed (e.g., identifying LCP elements, analyzing render-blocking resources) rather than the general 'guides debugging and optimizing'. Overall, it would perform well in a multi-skill selection scenario.

Suggestions

Replace the vague 'Guides debugging and optimizing' with specific concrete actions like 'Identifies LCP elements, analyzes render-blocking resources, diagnoses server response times, and recommends optimizations for Largest Contentful Paint'

Dimension	Reasoning	Score
Specificity	The description names the domain (LCP debugging/optimization) and mentions Chrome DevTools MCP tools, but the concrete actions are somewhat vague — 'guides debugging and optimizing' rather than listing specific actions like 'identifies LCP element, analyzes render-blocking resources, measures time to first byte'.	2 / 3
Completeness	Clearly answers both 'what' (debugging and optimizing LCP using Chrome DevTools MCP tools) and 'when' with explicit 'Use this skill whenever...' and 'Also use when...' clauses listing multiple trigger scenarios.	3 / 3
Trigger Term Quality	Excellent coverage of natural trigger terms: 'LCP', 'largest contentful paint', 'slow page loads', 'Core Web Vitals', 'CWV', 'page load speed', 'hero image', 'main content renders'. These are terms users would naturally use when seeking help with this topic.	3 / 3
Distinctiveness Conflict Risk	Highly distinctive — focuses specifically on LCP performance with Chrome DevTools MCP tools, a narrow niche unlikely to conflict with other skills. The specific mention of Core Web Vitals, LCP, and DevTools creates a clear boundary.	3 / 3
	Total	11 / 12 Passed

Implementation

85%

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

This is a well-structured, highly actionable skill that provides a clear debugging workflow with specific MCP tool calls and verification steps. Its main weakness is some verbosity in the introductory sections—the LCP definition, thresholds, and subparts breakdown include background knowledge Claude already possesses. The optimization strategies and debugging workflow sections are excellent, with concrete fixes tied to specific bottleneck subparts.

Suggestions

Trim the 'What is LCP' section to just the thresholds table—Claude already knows what LCP is, what Core Web Vitals are, and their impact on search ranking.

Condense the subparts breakdown table by removing the 'What it measures' column (Claude knows what TTFB is) and integrating the key insight ('delay subparts should be near zero') more concisely.

Dimension	Reasoning	Score
Conciseness	The opening section explaining what LCP is and the subparts breakdown includes information Claude likely already knows (Core Web Vitals definitions, thresholds, statistics like '73% of mobile pages'). The optimization strategies section is efficient, but the introductory material could be trimmed significantly.	2 / 3
Actionability	The skill provides specific MCP tool calls (navigate_page, performance_start_trace, performance_analyze_insight, evaluate_script, list_network_requests), concrete parameters (reload: true, autoStop: true, resourceTypes filter), and specific fix instructions with exact HTML attributes and tags to use. References to executable snippets are clearly pointed to.	3 / 3
Workflow Clarity	The debugging workflow is clearly sequenced in 5 numbered steps where each builds on the previous. There's an explicit verification step at the end (re-run trace and compare), and the workflow includes specific checkpoints like identifying the bottleneck subpart before applying fixes. The 'Common Pitfall' callout adds a useful feedback loop warning.	3 / 3
Progressive Disclosure	The skill is well-structured with clear sections (What/Why, Subparts, Debugging Workflow, Optimization, Verification) and appropriately delegates executable code snippets to references/lcp-snippets.md with clear links. Navigation is straightforward with one level of reference depth.	3 / 3
	Total	11 / 12 Passed

Validation

100%

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 — 11 / 11 Passed

Validation for skill structure

No warnings or errors.

Repository: ChromeDevTools/chrome-devtools-mcp
Commit: 1b857c9

Reviewed: 4 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.