web-perf

Name: web-perf
Availability: InStock
Author: achmf

Analyze Core Web Vitals and network traces via Chrome DevTools MCP.

Updated Jun 4, 2026

Search Tags:#performance #optimization #audit #devtools #network #web-vitals

Ready to run

npx skills add https://github.com/achmf/KostaHub --skill web-perf-achmf

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: web-perf
Source: https://github.com/achmf/KostaHub/tree/main/.agents/skills/web-perf
Command: npx skills add https://github.com/achmf/KostaHub --skill web-perf-achmf

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill addresses the complexity of diagnosing web performance bottlenecks by automating the collection and analysis of Core Web Vitals and network traces.

Core Features & Use Cases

Performance Auditing: Measures LCP, INP, CLS, and other critical metrics to identify site speed issues.
Network Analysis: Detects render-blocking resources, inefficient dependency chains, and caching misconfigurations.
Use Case: Use this skill to audit a landing page that is failing its Core Web Vitals assessment to pinpoint exactly which images or scripts are causing layout shifts and slow load times.

Quick Start

Run a full performance audit on the target URL by initiating the trace and analysis workflow.

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 to diagnose slow load times?▼

To audit Core Web Vitals, this skill automates trace collection and network analysis using Chrome DevTools MCP to pinpoint scripts and images causing layout shifts. It evaluates render-blocking resources and caching misconfigurations to identify site speed issues.

Why does my web page have a poor LCP and how can I find render-blocking resources?▼

A poor LCP often results from render-blocking resources detected via network trace analysis. This skill evaluates inefficient dependency chains and caching misconfigurations using Chrome DevTools MCP integration to highlight exactly which scripts delay your page load.

How do I analyze network behavior to fix web performance bottlenecks?▼

Analyzing network behavior involves detecting inefficient dependency chains and caching misconfigurations. This skill automates network trace collection through Chrome DevTools MCP to evaluate Core Web Vitals and locate the exact network requests causing performance bottlenecks.

Do I need an active Chrome DevTools MCP server to run a performance audit?▼

Yes, an active Chrome DevTools MCP server configuration is required. The performance audit relies on this integration to execute trace and network analysis commands needed for evaluating Core Web Vitals and identifying render-blocking resources.

Can I measure CLS and INP metrics to identify elements causing layout shifts?▼

Yes, you can measure CLS and INP metrics. This skill evaluates these critical Core Web Vitals alongside network behavior to pinpoint exactly which images or scripts are causing layout shifts and slow load times on your landing page.

What's the best way to automate web optimization tasks for failing Core Web Vitals assessments?▼

The best way to automate web optimization tasks is by running a full performance audit. This skill initiates a trace and analysis workflow to measure Core Web Vitals and detect accessibility gaps, diagnosing bottlenecks without manual inspection.