skills.rest
doanchienthangdev
doanchienthangdevCOMMUNITY
Explore all skills by this author →
GitHub

profiling-performance

Run Lighthouse audits and analyze Core Web Vitals for browser performance.

4|1|Updated Dec 30, 2025
Search Tags:#performance#optimization#bundle size#profiling#lighthouse#core web vitals
One-click install
npx skills add https://github.com/doanchienthangdev/omgkit --skill profiling-performance-doanchienthangdev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: profiling-performance
Source: https://github.com/doanchienthangdev/omgkit/tree/main/plugin/skills/devops/performance-profiling
Command: npx skills add https://github.com/doanchienthangdev/omgkit --skill profiling-performance-doanchienthangdev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires lighthouse, chrome-launcher, web-vitals, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses the challenge of slow-loading websites and poor user experience by providing tools to diagnose and improve web performance.

Core Features & Use Cases

  • Automated Audits: Run Lighthouse to get performance scores and actionable recommendations.
  • Core Web Vitals Monitoring: Track key user experience metrics like LCP, FID, CLS, and INP.
  • Bundle Analysis: Identify large JavaScript or CSS files that impact load times.
  • Use Case: A developer notices their e-commerce site is slow. They use this Skill to run a Lighthouse audit, identify an oversized image as the LCP bottleneck, and then optimize the image, re-auditing to confirm the performance improvement.

Quick Start

Use the profiling-performance skill to audit the performance of https://example.com.

Frequently Asked Questions about profiling-performance

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

FAQPage Schema
How do I run a Lighthouse audit to check my website's Core Web Vitals?▼

You can identify large JavaScript or CSS files impacting load times through bundle size analysis, which audits your application's assets to pinpoint oversized files and helps you establish performance budgets to prevent future bloat.

Can I use chrome-launcher to automate performance profiling for my web application?▼

Yes, you can use chrome-launcher alongside Lighthouse to automate browser performance profiling, allowing you to programmatically launch Chrome instances, run comprehensive performance diagnostics, and capture Core Web Vitals metrics without manual intervention.

What is the best way to diagnose slow-loading pages and improve Core Web Vitals?▼

The best way to diagnose slow-loading pages is through comprehensive performance profiling using Lighthouse and DevTools analysis, which audits page performance, identifies bottlenecks like oversized images, and provides actionable recommendations to improve Core Web Vitals.

Do I need web-vitals and lighthouse installed to analyze bundle sizes and set performance budgets?▼

Yes, you need web-vitals, lighthouse, and chrome-launcher installed as dependencies to perform comprehensive performance diagnostics, including analyzing bundle sizes, tracking user experience metrics, and implementing performance budgets effectively.

Why does my e-commerce site have a poor Lighthouse performance score despite optimized images?▼

Poor Lighthouse performance scores can persist despite optimized images due to other bottlenecks like large JavaScript bundles or render-blocking resources, which this skill diagnoses through DevTools analysis, Core Web Vitals monitoring, and comprehensive bundle size auditing.

Related Skills

Explore More Software Engineering Skills→
claughinghouseclaughinghouse

web-perf

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

Community
Advanced
simoabidsimoabid
1

performance-profiling

Measure Core Web Vitals and analyze runtime and bundle sizes with Lighthouse CLI.

Community
Intermediate
Gabrielloopes33Gabrielloopes33

perf-lighthouse

Run Lighthouse audits locally via CLI or Node API to measure performance and enforce budgets.

Community
Intermediate
X-School-AcademyX-School-Academy
9

dev-swarm-ux

Create UX design documentation with user flows, interaction specs, and interactive mockups.

Official
Advanced