Performance profiling

Skill bg-szy/TOP-SKILLS/skills/marketplace/performance-profiling

全球最大的 Claude Code 技能聚合库 · 收录 3900+ 来自 12+ 来源的技能，提供在线搜索与趋势分析看板 / The world's largest Claude Code skill aggregation hub — 3900+ skills from 12+ sources with online search and trend dashboard

Install

npx -y skills add bg-szy/TOP-SKILLS --skill performance-profiling

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

2 things to look at

no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
4 stars4 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Performance profiling principles. Measurement, analysis, and optimization techniques.

SKILL.md

3.0 KB, as published. Nobody here has run it

Performance Profiling

Measure, analyze, optimize - in that order.

🔧 Runtime Scripts

Execute these for automated profiling:

Script	Purpose	Usage
`scripts/lighthouse_audit.py`	Lighthouse performance audit	`python scripts/lighthouse_audit.py https://example.com`

1. Core Web Vitals

Targets

Metric	Good	Poor	Measures
LCP	< 2.5s	> 4.0s	Loading
INP	< 200ms	> 500ms	Interactivity
CLS	< 0.1	> 0.25	Stability

When to Measure

Stage	Tool
Development	Local Lighthouse
CI/CD	Lighthouse CI
Production	RUM (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

Problem	Tool
Page load	Lighthouse
Bundle size	Bundle analyzer
Runtime	DevTools Performance
Memory	DevTools Memory
Network	DevTools Network

3. Bundle Analysis

What to Look For

Issue	Indicator
Large dependencies	Top of bundle
Duplicate code	Multiple chunks
Unused code	Low coverage
Missing splits	Single large chunk

Optimization Actions

Finding	Action
Big library	Import specific modules
Duplicate deps	Dedupe, update versions
Route in main	Code split
Unused exports	Tree shake

4. Runtime Profiling

Performance Tab Analysis

Pattern	Meaning
Long tasks (>50ms)	UI blocking
Many small tasks	Possible batching opportunity
Layout/paint	Rendering bottleneck
Script	JavaScript execution

Memory Tab Analysis

Pattern	Meaning
Growing heap	Possible leak
Large retained	Check references
Detached DOM	Not cleaned up

5. Common Bottlenecks

By Symptom

Symptom	Likely Cause
Slow initial load	Large JS, render blocking
Slow interactions	Heavy event handlers
Jank during scroll	Layout thrashing
Growing memory	Leaks, retained refs

6. Quick Win Priorities

Priority	Action	Impact
1	Enable compression	High
2	Lazy load images	High
3	Code split routes	High
4	Cache static assets	Medium
5	Optimize images	Medium

7. Anti-Patterns

❌ Don't	✅ Do
Guess at problems	Profile first
Micro-optimize	Fix biggest issue
Optimize early	Optimize when needed
Ignore real users	Use RUM data

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