skills.rest
Rocktown-Labs
Rocktown-LabsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

web-perf

Audits web performance using Chrome DevTools MCP to measure Core Web Vitals and identify optimization opportunities.

Updated May 5, 2026
Search Tags:#mcp#chrome devtools#lighthouse#web performance#performance audit#core web vitals#page speed
One-click install
npx skills add https://github.com/Rocktown-Labs/reluxury --skill web-perf-rocktown-labs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-perf
Source: https://github.com/Rocktown-Labs/reluxury/tree/main/.agents/skills/web-perf
Command: npx skills add https://github.com/Rocktown-Labs/reluxury --skill web-perf-rocktown-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires chrome-devtools-mcp.

What problem does it solve? Diagnosing slow page loads and poor Lighthouse scores requires deep knowledge of performance tooling and metrics. This Skill provides a structured, five-phase audit workflow that measures Core Web Vitals, traces network behavior, and pinpoints concrete fixes with quantified impact. ## Core Features & Use Cases - Core Web Vitals Measurement: Captures LCP, INP, CLS, FCP, TBT, and Speed Index via Chrome DevTools performance traces with reload-based cold-load analysis. - Network & Render Analysis: Identifies render-blocking resources, network dependency chains, missing preloads, caching issues, and oversized payloads. - Codebase Analysis: Detects your framework and bundler (Webpack, Vite, Next.js, etc.) to surface tree-shaking, polyfill, minification, and dead-code issues. - Use Case: Ask for an audit of your staging site and receive a prioritized report: a Core Web Vitals summary table, top issues ranked by estimated impact, and specific fixes like "compress hero.png (450KB) to WebP". ## Quick Start Audit the performance of https://example.com and give me a prioritized list of fixes with estimated impact.

Frequently Asked Questions about web-perf

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit Core Web Vitals for my website?▼

Run a performance trace with reload enabled to capture cold-load metrics, then analyze insights like LCPBreakdown and CLSCulprits. Compare results against thresholds: LCP under 2.5s, INP under 200ms, and CLS under 0.1 are rated good.

How to find render-blocking resources on a page?▼

List network requests filtered by Script and Stylesheet types, then check for JS/CSS in the document head without async, defer, or media attributes. The RenderBlocking insight from a performance trace also flags these directly with estimated impact.

What MCP server is required for Chrome DevTools performance tracing?▼

The chrome-devtools MCP server is required, configured with the command npx -y chrome-devtools-mcp@latest. Without it, tools like navigate_page and performance_start_trace are unavailable and the audit cannot run.

Why does performance_start_trace return empty results?▼

An empty trace usually means the page did not load correctly before recording started. Verify the page loads with navigate_page first, and check the trace response for the insightSetId to discover which insight names are available in your Chrome version.

Can this audit third-party websites without codebase access?▼

Yes, the trace, Core Web Vitals, network, and accessibility phases work on any public URL. Only the codebase analysis phase is skipped, since it requires access to configuration files like webpack.config.js or package.json.

Related Skills

Explore More Software Engineering Skills→
ConsiliencyConsiliency
8

chrome-devtools-debugging

Debug web applications via Chrome DevTools Protocol with console and network inspection.

Official
Advanced
JoaoPedroAmaralJoaoPedroAmaral

web-performance-optimization

Audit websites with Lighthouse and WebPageTest to optimize Core Web Vitals.

Community
Intermediate
ChegginCheggin
1

optimize

Diagnoses UI performance issues and validates fixes with Core Web Vitals monitoring.

Community
Advanced
Community-AccessCommunity-Access
387

lighthouse-bridge

Parse Lighthouse CI reports and track accessibility score regressions.

Official
Advanced