helderberto/perf-audit
skills/perf-audit/SKILL.md
Audit frontend bundle size and performance. Use when user asks to "audit performance", "/perf-audit", "analyze bundle", "check bundle size", or wants to find performance bottlenecks. Don't use for backend performance, database query optimization, or projects without a frontend build step.
$ install --global
skillsauthnpx skillsauth add helderberto/skills perf-auditInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 30, 2026, 2:40 AM8.0s1 file scanned
SKILL.md
- name:
- perf-audit
- description:
- Audit frontend bundle size and performance. Use when user asks to "audit performance", "/perf-audit", "analyze bundle", "check bundle size", or wants to find performance bottlenecks. Don't use for backend performance, database query optimization, or projects without a frontend build step.
Performance Audit
Workflow
-
Detect build tool from
package.json(vite, webpack, next, rollup) -
Run production build if no recent build exists:
- Vite:
npm run build - Next.js:
npm run build(reads.next/analyze/ifANALYZE=true)
- Vite:
-
Analyze bundle output:
Vite:
npx vite-bundle-visualizerwebpack/Next.js:
npx webpack-bundle-analyzer <stats-file> -
Check
package.jsonfor known heavy packages (see table below) -
Report findings with size impact
Budget Thresholds
| Asset | Good | Warning | Critical | |---|---|---|---| | Initial JS (gzip) | < 150 KB | 150-300 KB | > 300 KB | | Initial CSS (gzip) | < 20 KB | 20-50 KB | > 50 KB | | Individual chunk | < 50 KB | 50-100 KB | > 100 KB | | Total page weight | < 500 KB | 500 KB-1 MB | > 1 MB |
Heavy Packages
| Package | Size | Alternative | Savings |
|---|---|---|---|
| moment | ~230 KB | date-fns / dayjs | ~200 KB |
| lodash (full) | ~70 KB | lodash/merge or native | ~60 KB |
| @mui/material (full) | ~300 KB | Named imports | ~150 KB |
| react-icons (all) | variable | Import only used icon packs | varies |
| axios | ~15 KB | ky or native fetch | ~10 KB |
Lighthouse Scores
| Metric | Good | Needs work | Poor | |---|---|---|---| | Performance | >= 90 | 50-89 | < 50 | | FCP | < 1.8s | 1.8-3s | > 3s | | LCP | < 2.5s | 2.5-4s | > 4s | | TBT | < 200ms | 200-600ms | > 600ms | | CLS | < 0.1 | 0.1-0.25 | > 0.25 |
Output format
- Bundle summary: total size / gzipped size vs budget
- Large chunks: name + size + % of total
- Heavy deps: package + size + lighter alternative
- Quick wins: sorted by estimated savings
Rules
- Compare against budget thresholds above
- Report gzipped sizes (what the browser downloads)
- Never auto-change dependencies -- report and suggest only
Error Handling
- Build fails -- report the error and stop; fix build issues before auditing
- No build output found -- run production build first
- Build tool unrecognized -- fall back to scanning
package.jsonfor heavy packages only
Related Skills
helderberto/caveman
testing
VerifiedTrustedCommunity
Ultra-compressed communication mode. Cuts token usage ~75% by speaking like caveman while keeping full technical accuracy. Supports intensity levels: lite, full (default), ultra, wenyan-lite, wenyan-full, wenyan-ultra. Use when user says "caveman mode", "talk like caveman", "use caveman", "less tokens", "be brief", or invokes /caveman. Also auto-triggers when token efficiency is requested.
10SKILL.mdUpdated May 12, 2026
helderberto/handoff
documentation
VerifiedTrustedCommunity
Compact the current conversation into a handoff doc so a fresh agent can continue the work. Use when user asks to "handoff", "/handoff", "hand this off", or wants to end a session mid-task. Don't use for summarising completed work, writing PRDs/plans/ADRs, or committing changes.
8SKILL.mdUpdated May 20, 2026
helderberto/create-skill
development
VerifiedTrustedCommunity
Create new agent skills with proper structure, progressive disclosure, and bundled resources. Use when user wants to create, write, or build a new skill, or asks "make a skill for X".
8SKILL.mdUpdated May 20, 2026
helderberto/zoom-out
development
VerifiedTrustedCommunity
Tell the agent to zoom out and give broader context or a higher-level perspective. Use when you're unfamiliar with a section of code or need to understand how it fits into the bigger picture.
8SKILL.mdUpdated May 12, 2026