Skip to content
Development
Skill

/performance-engineering

When validating system performance under load, identifying bottlenecks through profiling, or optimizing application responsiveness. Covers load testing (k6, Locust), profiling (CPU, memory, I/O), and optimization strategies (caching, query optimization, Core Web Vitals). Use for

From plugin
ai-design-components
53376 skills

Claude Code

$ npx -y skills add ancoleman/ai-design-components --skill performance-engineering --agent claude-code

SKILL.md

performance-engineering.SKILL.md
name: performance-engineering
description: When validating system performance under load, identifying bottlenecks through profiling, or optimizing application responsiveness. Covers load testing (k6, Locust), profiling (CPU, memory, I/O), and optimization strategies (caching, query optimization, Core Web Vitals). Use for capacity planning, regression detection, and establishing performance SLOs.

Performance Engineering

Purpose

Performance engineering encompasses load testing, profiling, and optimization to deliver reliable, scalable systems. This skill provides frameworks for choosing the right performance testing approach (load, stress, soak, spike), profiling techniques to identify bottlenecks (CPU, memory, I/O), and optimization strategies for backend APIs, databases, and frontend applications.

Use this skill to validate system capacity before launch, detect performance regressions in CI/CD pipelines, identify and resolve bottlenecks through profiling, and optimize application responsiveness across the stack.

When to Use This Skill

**Common Triggers:**

  • "Validate API can handle expected traffic"
  • "Find maximum capacity and breaking points"
  • "Identify why the application is slow"
  • "Detect memory leaks or resource exhaustion"
  • "Optimize Core Web Vitals for SEO"
  • "Set up performance testing in CI/CD"
  • "Reduce cloud infrastructure costs"

**Use Cases:**

  • Pre-launch capacity planning and load validation
  • Post-refactor performance regression testing
  • Investigating slow response times or high latency
  • Detecting memory leaks in long-running services
  • Optimizing database query performance
  • Validating auto-scaling configuration
  • Establishing performance SLOs and budgets

Performance Testing Types

Load Testing

Validate system behavior under expected traffic levels.

**When to use:** Pre-launch capacity planning, regression testing after refactors, validating auto-scaling.

Stress Testing

Find system capacity limits and failure modes.

**When to use:** Capacity planning, understanding failure behavior, infrastructure sizing decisions.

Soak Testing

Identify memory leaks, resource exhaustion, and degradation over time.

**When to use:** Detecting memory leaks, validating connection pool cleanup, testing long-running batch jobs.

Spike Testing

Validate system response to sudden traffic spikes.

**When to use:** Validating auto-scaling, testing event-driven systems (product launches), ensuring rate limiting works.

Quick Decision Framework

**Which test type to use?**

What am I trying to learn?
├─ Can my system handle expected traffic? → LOAD TEST
├─ What's the maximum capacity? → STRESS TEST
├─ Will it stay stable over time? → SOAK TEST
└─ Can it handle traffic spikes? → SPIKE TEST

For detailed testing patterns, load scenarios, and interpreting results, see `references/testing-types.md`.

Load Testing Quick Starts

k6 (JavaScript)

**Installation:**

brew install k6  # macOS
sudo apt-get install k6  # Linux

**Basic Load Test:**

import http from 'k6/http';
import { check, sleep } from 'k6';

export const options = {
  stages: [
    { duration: '30s', target: 20 },
    { duration: '1m', target: 20 },
    { duration: '30s', target: 0 },
  ],
  thresholds: {
    http_req_duration: ['p(95)<500'],
    http_req_failed: ['rate<0.01'],
  },
};

export default function () {
  const res = http.get('https://api.example.com/products');
  check(res, {
    'status is 200': (r) => r.status === 200,
  });
  sleep(1);
}

**Run:** `k6 run script.js`

For stress, soak, and spike testing examples, see `examples/k6/`.

Locust (Python)

**Installation:**

pip install locust

**Basic Load Test:**

from locust import HttpUser, task, between

class WebsiteUser(HttpUser):
    wait_time = between(1, 3)
    host = "https://api.example.com"

    @task(3)
    def view_products(self):
        self.client.get("/products")

    @task(1)
    def view_product_detail(self):
        self.client.get("/products/123")

**Run:** `locust -f locustfile.py --headless -u 100 -r 10 --run-time 10m`

For REST API testing and data-driven testing, see `examples/locust/`.

Profiling Quick Starts

When to Profile

| Symptom | Profiling Type | Tool | |---------|----------------|------| | High CPU (>70%) | CPU Profiling | py-spy, pprof, DevTools | | Memory growing | Memory Profiling | memory_profiler, pprof heap | | Slow response, low CPU | I/O Profiling | Query logs, pprof block |

Python Profiling

**py-spy (Production-Safe):**

pip install py-spy

# Profile running process
py-spy record -o profile.svg --pid <PID> --duration 30

# Top-like view
py-spy top --pid <PID>

**Memory Profiling:**

from memory_profiler import profile

@profile
def my_function():
    a = [1] * (10 ** 6)
    return a

# Run: python -m memory_profiler script.py

Go Profiling

**pprof (Built-in):**

import (
    "net/http"
    _ "net/http/pprof"
)

func main() {
    go func() {
        http.ListenAndServe("localhost:6060", nil)
    }()
    startApp()
}

**Capture profile:**

# CPU profile (30 seconds)
go tool pprof http://localhost:6060/debug/pprof/profile?seconds=30

# Interactive analysis
(pprof) top
(pprof) web

TypeScript/JavaScript Profiling

**Chrome DevTools (Browser/Node.js):**

Node.js:

node --inspect app.js
# Open chrome://inspect
# Performance tab → Record

**clinic.js (Node.js):**

npm install -g clinic
clinic doctor -- node app.js

For detailed profiling workflows and analysis, see `references/profiling-guide.md` and `examples/profiling/`.

Optimization Strategies

Caching

**When to cache:**

  • Data queried frequently (>100 req/min)
  • Data freshness tolerance (>1 minute acceptable staleness)

**Redis example:**

import redis
r = redis.Redis()

def get_cached_data(key, fn, ttl=300):
    cached = r.get(key)
    if cached:
        return
Read more
@ancoleman
Ships withai-design-components

Comprehensive UI/UX and Backend component design skills for AI-assisted development with Claude

Stars on GitHub

Momentum

stars in total
533
Star history of ancoleman/ai-design-components on GitHub, a chart by star-history.com

Other skills on ai-design-components.

More skills from other plugins.

brainstorming
Auto-invoked

brainstorming

You MUST use this before any creative work - creating features, building components, adding functionality, modifying behavior, or…

@obra@obraInstall Skill
ask-matt

ask-matt

Ask which skill or flow fits your situation. A router over the skills in this repo.

skills2w309k
@mattpocock@mattpocockInstall Skill
accessibility
Auto-invoked

accessibility

Design, implement, and audit accessible UI to WCAG 2.2 Level AA across Web, iOS, and Android — semantic ARIA roles and labels,…

ecc2w293k
@affaan-m@affaan-mInstall Skill
compiler-commit

compiler-commit

Use when you want to verify compiler changes and commit with the correct convention. Runs tests, lint, and format, then commits…

react5d252k
@facebook@facebookInstall Skill

Questions about performance-engineering.

Which coding agents can use performance-engineering?
performance-engineering installs in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI, using each agent's flag shown on this page. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.