Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
ahmed2020se avatar

Performance Profiling

  • 1 installs
  • Updated April 11, 2026
  • ahmed2020se/dotfiles

performance-profiling is a Claude Code skill that guides web performance measurement, analysis, and optimization against Core Web Vitals targets.

About

performance-profiling is a Claude Code skill that guides web performance work in a measure-then-optimize order. It sets Core Web Vitals targets for LCP, INP, and CLS, maps each performance problem to the right tool, and lays out a 4-step baseline-identify-fix-validate process. It covers bundle analysis, runtime and memory profiling, common bottlenecks, and a prioritized list of quick wins, with a bundled Lighthouse audit script.

  • Measure-analyze-optimize workflow with a 4-step profiling process
  • Core Web Vitals targets (LCP, INP, CLS) and tool selection per problem type
  • Bundle, runtime, and memory analysis with prioritized quick wins

Performance Profiling by the numbers

  • 1 all-time installs (skills.sh)
  • Ranked #489 of 596 Debugging skills by installs in the Skillselion catalog
  • Data as of Jul 7, 2026 (Skillselion catalog sync)
At a glance

performance-profiling capabilities & compatibility

Capabilities
performance profiling · core web vitals audit · bundle analysis · memory profiling
Use cases
debugging · testing
Pricing
Free
From the docs

What performance-profiling says it does

Measure, analyze, optimize - in that order.
SKILL.md
The fastest code is code that doesn't run. Remove before optimizing.
SKILL.md
npx skills add https://github.com/ahmed2020se/dotfiles --skill performance-profiling

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs1
Last updatedApril 11, 2026
Repositoryahmed2020se/dotfiles

What it does

Profile a web app's load, runtime, and memory performance, then apply prioritized, measured optimizations against Core Web Vitals targets.

Who is it for?

Diagnosing slow page loads, janky interactions, or growing memory in a web app and applying measured fixes.

Skip if: Guessing at problems or micro-optimizing before profiling; the skill insists on measuring first.

When should I use this skill?

A page loads slowly, interactions are janky, memory is growing, or Core Web Vitals need improvement.

What you get

A profiled baseline, an identified bottleneck, and a validated, prioritized performance fix.

  • A performance baseline
  • An identified bottleneck
  • A validated optimization

By the numbers

  • 4-step profiling process
  • Core Web Vitals: LCP < 2.5s, INP < 200ms, CLS < 0.1

Files

SKILL.mdMarkdownGitHub ↗

Performance Profiling

Measure, analyze, optimize - in that order.

🔧 Runtime Scripts

Execute these for automated profiling:

ScriptPurposeUsage
scripts/lighthouse_audit.pyLighthouse performance auditpython scripts/lighthouse_audit.py https://example.com

---

1. Core Web Vitals

Targets

MetricGoodPoorMeasures
LCP< 2.5s> 4.0sLoading
INP< 200ms> 500msInteractivity
CLS< 0.1> 0.25Stability

When to Measure

StageTool
DevelopmentLocal Lighthouse
CI/CDLighthouse CI
ProductionRUM (Real User Monitoring)

---

2. Profiling Workflow

The 4-Step Process

1. BASELINE → Measure current state
2. IDENTIFY → Find the bottleneck
3. FIX → Make targeted change
4. VALIDATE → Confirm improvement

Profiling Tool Selection

ProblemTool
Page loadLighthouse
Bundle sizeBundle analyzer
RuntimeDevTools Performance
MemoryDevTools Memory
NetworkDevTools Network

---

3. Bundle Analysis

What to Look For

IssueIndicator
Large dependenciesTop of bundle
Duplicate codeMultiple chunks
Unused codeLow coverage
Missing splitsSingle large chunk

Optimization Actions

FindingAction
Big libraryImport specific modules
Duplicate depsDedupe, update versions
Route in mainCode split
Unused exportsTree shake

---

4. Runtime Profiling

Performance Tab Analysis

PatternMeaning
Long tasks (>50ms)UI blocking
Many small tasksPossible batching opportunity
Layout/paintRendering bottleneck
ScriptJavaScript execution

Memory Tab Analysis

PatternMeaning
Growing heapPossible leak
Large retainedCheck references
Detached DOMNot cleaned up

---

5. Common Bottlenecks

By Symptom

SymptomLikely Cause
Slow initial loadLarge JS, render blocking
Slow interactionsHeavy event handlers
Jank during scrollLayout thrashing
Growing memoryLeaks, retained refs

---

6. Quick Win Priorities

PriorityActionImpact
1Enable compressionHigh
2Lazy load imagesHigh
3Code split routesHigh
4Cache static assetsMedium
5Optimize imagesMedium

---

7. Anti-Patterns

❌ Don't✅ Do
Guess at problemsProfile first
Micro-optimizeFix biggest issue
Optimize earlyOptimize when needed
Ignore real usersUse RUM data

---

Remember: The fastest code is code that doesn't run. Remove before optimizing.

Related skills

FAQ

What order does performance-profiling recommend?

Measure, analyze, then optimize; it runs a baseline-identify-fix-validate loop rather than guessing at problems.

Which Core Web Vitals does it target?

LCP under 2.5s, INP under 200ms, and CLS under 0.1.

Debuggingfrontendtesting

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.