web-perf

Analyze web performance metrics and accessibility using Chrome DevTools APIs.

95|4|Updated Apr 12, 2026

Search Tags:#accessibility #performance optimization #web performance #Chrome DevTools #Core Web Vitals

One-click install

npx skills add https://github.com/try-works/role-model --skill web-perf-try-works

Or copy as Structured Prompt for Agent▼

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires chrome-devtools-mcp, performance, performance-insights, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides comprehensive web performance analysis using Chrome DevTools, focusing on Core Web Vitals and supplementary metrics. It identifies performance bottlenecks, accessibility issues, and other factors affecting page load speed and Lighthouse scores.

Core Features & Use Cases

Performance Metrics Analysis: Measures and evaluates Core Web Vitals (LCP, INP, CLS) and additional metrics (FCP, TBT, Speed Index).
Resource Optimization: Identifies render-blocking resources, network dependency chains, and caching issues.
Accessibility Assessment: Evaluates page accessibility, highlighting gaps and areas for improvement.
Use Case: Use this Skill to audit, profile, debug, or optimize the performance of a web page, ensuring it meets the highest standards of user experience.

Quick Start

Run the web-perf skill to audit the performance of the web page at 'https://example.com'.

Frequently Asked Questions about web-perf

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

FAQPage Schema

How do I audit web performance using Chrome DevTools?▼

Core Web Vitals measure crucial user experience metrics including LCP, INP, and CLS, alongside supplementary metrics like FCP, TBT, and Speed Index, to identify performance bottlenecks affecting page load speed.

What's the best way to identify render-blocking resources and network dependency chains?▼

Resource optimization analysis identifies render-blocking resources, network dependency chains, and caching issues by profiling web pages to pinpoint factors affecting load speed and Lighthouse scores.

Can I assess page accessibility alongside Core Web Vitals metrics?▼

Accessibility assessment evaluates page accessibility by highlighting gaps and areas for improvement, running concurrently with Core Web Vitals measurement during the web performance audit.

Do I need chrome-devtools-mcp to analyze Core Web Vitals?▼

Yes, automating web performance analysis requires chrome-devtools-mcp and related performance libraries to interact with Chrome DevTools APIs and extract Core Web Vitals insights.