shipshitdev/performance-expert
skills/performance-expert/SKILL.md
Expert in performance optimization for React, Next.js, NestJS applications covering frontend rendering, API response times, database queries, and infrastructure optimization. Use when optimizing React components or Next.js pages, improving API response times, optimizing database queries, analyzing bundle sizes, or implementing caching.
$ install --global
skillsauthnpx skillsauth add shipshitdev/library performance-expertInstall 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: Jul 1, 2026, 5:14 AM84.0s3 files scanned
SKILL.md
- name:
- performance-expert
- description:
- Expert in performance optimization for React, Next.js, NestJS applications covering frontend rendering, API response times, database queries, and infrastructure optimization. Use when optimizing React components or Next.js pages, improving API response times, optimizing database queries, analyzing bundle sizes, or implementing caching.
- version:
- 1.0.0
- tags:
- performance, optimization, fullstack
Performance Expert Skill
When to Use
- Optimizing React components or Next.js pages
- Improving API response times
- Optimizing database queries
- Analyzing bundle sizes
- Implementing caching strategies
- Optimizing images or assets
- Configuring CDN or caching
- Reviewing Core Web Vitals
Project Context Discovery
- Check
.agents/memory/for performance architecture context (e.g.,repo_frontend_design_execution.md, any*performance*or*architecture*files) - Identify performance tools (Lighthouse CI, APM)
- Review existing optimizations and caching strategies
- Check for
[project]-performance-expertskill
Core Performance Principles
Frontend (React/Next.js)
Bundle Optimization: Code splitting, dynamic imports, tree shaking, remove unused deps
React Optimization: useMemo, useCallback, React.memo, virtualization, lazy loading
Next.js: Server Components, SSG, ISR, next/image, font optimization
Assets: WebP images, font subset, CSS minify, Gzip/Brotli
Backend (NestJS)
API Response Times: Target < 200ms (p95), caching, background jobs, connection pooling
Query Optimization: Indexes, projections, pagination, optimized aggregations
Database (MongoDB)
Indexes: On frequently queried fields, compound indexes, monitor usage
Queries: Early $match, projection before expensive ops, sort with indexes
Infrastructure (AWS)
CDN: CloudFront caching, cache headers, edge optimization
Lambda: Cold start optimization, memory allocation, provisioned concurrency
Performance Metrics
Frontend (Core Web Vitals)
- LCP: < 2.5s
- FID: < 100ms
- CLS: < 0.1
- FCP: < 1.8s
Backend
- API p50: < 100ms
- API p95: < 200ms
- DB Query p95: < 50ms
- Error Rate: < 0.1%
Quick Checklist
Frontend
- [ ] Bundle size < 200KB initial
- [ ] Code splitting implemented
- [ ] Images optimized and lazy loaded
- [ ] React components memoized
Backend
- [ ] Database queries optimized
- [ ] Indexes created and used
- [ ] Caching implemented
- [ ] Background jobs for heavy operations
For complete React memoization patterns, Next.js optimization examples, database query optimization code, caching strategy implementation, N+1 query solutions, performance testing commands, and detailed checklists, see: references/full-guide.md
Related Skills
shipshitdev/typescript-refactor
development
VerifiedTrustedCommunity
TypeScript refactoring and modernization guidelines from a principal specialist perspective. This skill should be used when refactoring, reviewing, or modernizing TypeScript code to ensure type safety, compiler performance, and idiomatic patterns. Triggers on tasks involving TypeScript type architecture, narrowing, generics, error handling, or migration to modern TypeScript features.
30SKILL.mdUpdated Jul 14, 2026
shipshitdev/typescript-expert
tools
VerifiedTrustedCommunity
Resolves TypeScript and JavaScript problems across type-level programming, performance, monorepo management, migration, and modern tooling. Invoke when diagnosing "type instantiation excessively deep" errors, migrating JS to TS, configuring strict tsconfig, debugging module resolution, or choosing between Biome/ESLint/Turborepo/Nx.
30SKILL.mdUpdated Jul 14, 2026
shipshitdev/turborepo
tools
VerifiedTrustedCommunity
Turborepo monorepo build system guidance. Triggers on: `turbo.json`, task pipelines, `dependsOn`, caching, remote cache, the `turbo` CLI, `--filter`, `--affected`, CI optimization, environment variables, internal packages, monorepo structure, and package boundaries. Use when the user configures tasks or workflows, creates packages, sets up a monorepo, shares code between apps, runs changed packages, debugs cache behavior, or works in an `apps/` plus `packages/` workspace.
30SKILL.mdUpdated Jul 14, 2026
shipshitdev/tailwind
tools
VerifiedTrustedCommunity
Provides Tailwind CSS v4 performance optimization and best practices guidelines. Triggers when writing, reviewing, or refactoring Tailwind CSS v4 code; when working with Tailwind configuration, @theme directive, utility classes, responsive design, dark mode, container queries, or CSS generation optimization.
30SKILL.mdUpdated Jul 14, 2026