skills.rest
babually
babuallyCOMMUNITY
Explore all skills by this author →
GitHub

web-perf

Analyze Core Web Vitals and Chrome DevTools traces to diagnose web performance issues.

1|Updated Jun 27, 2026
Search Tags:#accessibility#chrome devtools#lighthouse#web performance#core web vitals#page speed
One-click install
npx skills add https://github.com/babually/bongo-template --skill web-perf-babually
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-perf
Source: https://github.com/babually/bongo-template/tree/main/.agents/skills/web-perf
Command: npx skills add https://github.com/babually/bongo-template --skill web-perf-babually

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps diagnose why a webpage feels slow, ranks poorly in performance audits, or suffers from layout instability and delayed interactivity.

Core Features & Use Cases

  • Core Web Vitals Analysis: Measures LCP, INP, CLS, and related metrics to determine whether a page is healthy or needs optimization.
  • Trace and Network Inspection: Uses Chrome DevTools performance traces and request analysis to uncover render-blocking assets, dependency chains, caching issues, and large payloads.
  • Accessibility Snapshot: Checks for high-level accessibility problems that often accompany poor UX, such as missing names, contrast issues, and focus traps.
  • Use Case: A product team can audit a landing page, identify the exact resources delaying first render, and prioritize fixes with estimated impact.

Quick Start

Audit the target page for Core Web Vitals, network bottlenecks, and accessibility gaps, then summarize the highest-impact fixes.

Frequently Asked Questions about web-perf

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

FAQPage Schema
How do I diagnose slow web pages and identify render-blocking resources?▼

Diagnose slow web pages by analyzing page load behavior, Core Web Vitals, and Chrome DevTools performance traces to identify render-blocking resources, dependency chains, and large payloads. It provides quantified recommendations to fix delayed rendering.

What are Core Web Vitals and how do I audit them for my website?▼

Core Web Vitals measure page speed and stability using LCP, INP, and CLS metrics. Audit them for your website by capturing Chrome DevTools traces to determine whether pages are healthy or need optimization for slow rendering and layout shifts.

Does this web performance analysis require Chrome DevTools to inspect network requests?▼

Yes, web performance analysis requires Chrome DevTools MCP tooling to inspect network requests, performance traces, and accessibility snapshots. This environment setup enables precise auditing of caching issues, blocking assets, and high-level accessibility problems.

Can I check accessibility issues like missing names and contrast problems during a performance audit?▼

Yes, you can check accessibility issues during a performance audit by capturing accessibility snapshots. It detects high-level accessibility problems accompanying poor UX, such as missing names, contrast issues, and focus traps alongside page speed metrics.

What is the best way to prioritize fixes for layout shifts and delayed interactivity?▼

Prioritize fixes for layout shifts and delayed interactivity by analyzing Core Web Vitals and trace data to uncover dependency chains. It summarizes the highest-impact fixes with estimated impact, allowing product teams to address bottlenecks efficiently.

Related Skills

Explore More Software Engineering Skills→
mpsuessermpsuesser

web-perf

Measure Core Web Vitals and diagnose page-load bottlenecks using Chrome DevTools traces.

Community
Advanced
iadr-deviadr-dev
2

web-perf

Analyze Core Web Vitals and diagnose page load bottlenecks via Chrome DevTools.

Community
Intermediate
warpdotdevwarpdotdev
820

web-performance-audit

Audit web page performance with Chrome DevTools MCP traces and Core Web Vitals.

Official
Advanced
charl-krugercharl-kruger
5

web-perf

Measure Core Web Vitals and profile resource timing with Chrome DevTools MCP.

Community
Advanced