@patricio0312rev/skillset 0.1.0

package/templates/performance/caching-cdn-strategy-planner/ SKILL.md

@@ -0,0 +1,150 @@
+---
+name: caching-cdn-strategy-planner
+description: Designs multi-layer caching strategy with edge CDN, server-side caching, cache invalidation, and CDN configuration. Use for "caching strategy", "CDN setup", "cache invalidation", or "performance optimization".
+---
+
+# Caching & CDN Strategy Planner
+
+Design effective caching at all layers.
+
+## Caching Layers
+
+```
+Client → CDN (Edge) → Server Cache → Database
+```
+
+## CDN Configuration (CloudFront)
+
+```typescript
+const distribution = {
+  Origins: [
+    {
+      DomainName: "api.example.com",
+      CustomHeaders: [
+        {
+          HeaderName: "X-CDN-Secret",
+          HeaderValue: process.env.CDN_SECRET,
+        },
+      ],
+    },
+  ],
+  DefaultCacheBehavior: {
+    ViewerProtocolPolicy: "redirect-to-https",
+    AllowedMethods: ["GET", "HEAD", "OPTIONS"],
+    CachedMethods: ["GET", "HEAD"],
+    Compress: true,
+    DefaultTTL: 86400, // 1 day
+    MaxTTL: 31536000, // 1 year
+    MinTTL: 0,
+    ForwardedValues: {
+      QueryString: true,
+      Cookies: { Forward: "none" },
+      Headers: ["Accept", "Accept-Encoding"],
+    },
+  },
+  CacheBehaviors: [
+    {
+      PathPattern: "/api/static/*",
+      DefaultTTL: 31536000, // 1 year - never changes
+    },
+    {
+      PathPattern: "/api/dynamic/*",
+      DefaultTTL: 300, // 5 min - changes frequently
+    },
+  ],
+};
+```
+
+## Server-side Caching (Redis)
+
+```typescript
+import Redis from 'ioredis';
+
+const redis = new Redis(process.env.REDIS_URL);
+
+async function getCachedOrFetch<T>(
+  key: string,
+  fetcher: () => Promise<T>,
+  ttl: number = 3600
+): Promise<T> {
+  // Try cache
+  const cached = await redis.get(key);
+  if (cached) {
+    return JSON.parse(cached);
+  }
+
+  // Fetch and cache
+  const data = await fetcher();
+  await redis.setex(key, ttl, JSON.stringify(data));
+
+  return data;
+}
+
+// Usage
+app.get('/api/user/:id', async (req, res) => {
+  const user = await getCachedOrFetch(
+    \`user:\${req.params.id}\`,
+    () => prisma.user.findUnique({ where: { id: req.params.id } }),
+    3600
+  );
+
+  res.json(user);
+});
+```
+
+## Cache Invalidation
+
+```typescript
+// Invalidate on update
+app.put('/api/user/:id', async (req, res) => {
+  const user = await prisma.user.update({
+    where: { id: req.params.id },
+    data: req.body,
+  });
+
+  // Invalidate cache
+  await redis.del(\`user:\${req.params.id}\`);
+
+  // Invalidate CDN
+  await cloudfront.createInvalidation({
+    DistributionId: DISTRIBUTION_ID,
+    InvalidationBatch: {
+      Paths: { Items: [\`/api/user/\${req.params.id}\`] },
+      CallerReference: Date.now().toString(),
+    },
+  });
+
+  res.json(user);
+});
+```
+
+## Cache Headers
+
+```typescript
+app.get("/api/products", (req, res) => {
+  res.set({
+    "Cache-Control": "public, max-age=3600", // Browser + CDN: 1h
+    ETag: generateETag(products),
+    "Last-Modified": new Date(products.updatedAt).toUTCString(),
+  });
+
+  res.json(products);
+});
+
+app.get("/api/user/profile", (req, res) => {
+  res.set({
+    "Cache-Control": "private, no-cache", // No caching (sensitive)
+  });
+
+  res.json(profile);
+});
+```
+
+## Output Checklist
+
+- [ ] CDN configured
+- [ ] Server cache implemented
+- [ ] Invalidation strategy
+- [ ] Cache headers set
+- [ ] Monitoring configured
+      ENDFILE

package/templates/performance/capacity-planning-helper/ SKILL.md

@@ -0,0 +1,242 @@
+---
+name: capacity-planning-helper
+description: Estimates infrastructure needs based on traffic forecasts, workload analysis, and performance requirements with sizing recommendations and cost trade-offs. Use for "capacity planning", "infrastructure sizing", "resource estimation", or "scalability planning".
+---
+
+# Capacity Planning Helper
+
+Right-size infrastructure for current and future needs.
+
+## Traffic Forecasting
+
+```typescript
+interface TrafficForecast {
+  current: {
+    dailyUsers: number;
+    peakRPS: number;
+    avgRPS: number;
+  };
+  projected: {
+    timeframe: "6m" | "12m" | "24m";
+    dailyUsers: number;
+    peakRPS: number;
+    avgRPS: number;
+    growthRate: number;
+  };
+}
+
+const forecast: TrafficForecast = {
+  current: {
+    dailyUsers: 100000,
+    peakRPS: 500,
+    avgRPS: 200,
+  },
+  projected: {
+    timeframe: "12m",
+    dailyUsers: 500000, // 5x growth
+    peakRPS: 2500,
+    avgRPS: 1000,
+    growthRate: 4.0, // 400% growth
+  },
+};
+```
+
+## Resource Estimation
+
+```typescript
+interface ResourceNeeds {
+  compute: {
+    instanceType: string;
+    instanceCount: number;
+    cpu: number;
+    memory: number;
+  };
+  database: {
+    instanceType: string;
+    instanceCount: number;
+    storage: number;
+    iops: number;
+  };
+  cache: {
+    instanceType: string;
+    nodes: number;
+    memory: number;
+  };
+}
+
+function estimateResources(forecast: TrafficForecast): ResourceNeeds {
+  const { peakRPS } = forecast.projected;
+
+  // Rule of thumb: 100 RPS per instance (with headroom)
+  const instanceCount = Math.ceil(peakRPS / 100);
+
+  // Database: 1000 connections per 2vCPU
+  const dbInstances = Math.ceil((peakRPS * 2) / 1000);
+
+  return {
+    compute: {
+      instanceType: "t3.large",
+      instanceCount: instanceCount * 1.5, // 50% headroom
+      cpu: 2 * instanceCount,
+      memory: 8 * instanceCount,
+    },
+    database: {
+      instanceType: "db.r6g.xlarge",
+      instanceCount: dbInstances,
+      storage: 1000, // GB
+      iops: 10000,
+    },
+    cache: {
+      instanceType: "cache.r6g.large",
+      nodes: 2, // Primary + replica
+      memory: 12, // GB
+    },
+  };
+}
+```
+
+## Cost Estimation
+
+```typescript
+interface CostEstimate {
+  monthly: {
+    compute: number;
+    database: number;
+    cache: number;
+    storage: number;
+    bandwidth: number;
+    total: number;
+  };
+  annual: number;
+}
+
+const pricing = {
+  "t3.large": 0.0832, // $/hour
+  "db.r6g.xlarge": 0.336,
+  "cache.r6g.large": 0.226,
+  storage: 0.1, // $/GB/month
+  bandwidth: 0.09, // $/GB
+};
+
+function estimateCost(
+  resources: ResourceNeeds,
+  trafficGB: number
+): CostEstimate {
+  const hoursPerMonth = 730;
+
+  const monthly = {
+    compute:
+      resources.compute.instanceCount * pricing["t3.large"] * hoursPerMonth,
+    database:
+      resources.database.instanceCount *
+      pricing["db.r6g.xlarge"] *
+      hoursPerMonth,
+    cache: resources.cache.nodes * pricing["cache.r6g.large"] * hoursPerMonth,
+    storage: resources.database.storage * pricing.storage,
+    bandwidth: trafficGB * pricing.bandwidth,
+    total: 0,
+  };
+
+  monthly.total = Object.values(monthly).reduce((sum, cost) => sum + cost, 0);
+
+  return {
+    monthly,
+    annual: monthly.total * 12,
+  };
+}
+```
+
+## Scale Triggers
+
+```yaml
+# auto-scaling-config.yml
+scaling:
+  triggers:
+    - metric: cpu_utilization
+      threshold: 70%
+      action: scale_up
+      cooldown: 5m
+
+    - metric: cpu_utilization
+      threshold: 30%
+      action: scale_down
+      cooldown: 15m
+
+    - metric: request_queue_depth
+      threshold: 1000
+      action: scale_up
+      cooldown: 1m
+
+  limits:
+    min_instances: 2
+    max_instances: 20
+
+  schedule:
+    # Pre-scale for known traffic patterns
+    - time: "08:00"
+      target_instances: 10
+    - time: "22:00"
+      target_instances: 4
+```
+
+## Cost/Performance Tradeoffs
+
+```markdown
+# Infrastructure Options
+
+## Option 1: Cost-Optimized ($2,500/mo)
+
+- Compute: 4x t3.large
+- Database: 1x db.r6g.large
+- Cache: 1x cache.r6g.medium
+- **Pros:** Lowest cost
+- **Cons:** Limited headroom, potential latency issues
+
+## Option 2: Balanced ($5,000/mo)
+
+- Compute: 8x t3.large
+- Database: 2x db.r6g.xlarge
+- Cache: 2x cache.r6g.large
+- **Pros:** Good headroom, redundancy
+- **Cons:** Moderate cost
+
+## Option 3: Performance-Optimized ($10,000/mo)
+
+- Compute: 12x c6g.xlarge
+- Database: 3x db.r6g.2xlarge
+- Cache: 3x cache.r6g.xlarge
+- **Pros:** Maximum performance, high availability
+- **Cons:** Higher cost
+
+## Recommendation
+
+Start with Option 2, monitor for 1 month, adjust based on:
+
+- Actual CPU/memory utilization
+- Database query performance
+- Cache hit rates
+```
+
+## Capacity Planning Spreadsheet
+
+```
+| Metric              | Current | 6mo Proj | 12mo Proj | Notes                    |
+|---------------------|---------|----------|-----------|--------------------------|
+| Daily Users         | 100k    | 250k     | 500k      | 5x growth expected       |
+| Peak RPS            | 500     | 1250     | 2500      | Linear w/ users          |
+| DB Connections      | 100     | 250      | 500       | 2 per instance           |
+| Storage (GB)        | 100     | 300      | 1000      | User data + logs         |
+| Bandwidth (TB)      | 1       | 3        | 10        | Images + video           |
+| Instance Count      | 4       | 10       | 20        | Auto-scaling             |
+| Monthly Cost        | $2k     | $5k      | $10k      | AWS estimate             |
+```
+
+## Output Checklist
+
+- [ ] Traffic forecast
+- [ ] Resource estimates
+- [ ] Cost analysis
+- [ ] Scale triggers
+- [ ] Performance targets
+- [ ] Growth plan
+      ENDFILE

package/templates/performance/core-web-vitals-tuner/ SKILL.md

@@ -0,0 +1,126 @@
+---
+name: core-web-vitals-tuner
+description: Systematically improves Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS) with prioritized fixes and verification. Use for "Core Web Vitals", "performance", "LCP", "INP", or "CLS".
+---
+
+# Core Web Vitals Tuner
+
+Improve LCP, INP, and CLS systematically.
+
+## LCP Optimization (<2.5s)
+
+**Prioritized Fixes:**
+
+1. **Optimize images** (Biggest impact)
+
+   ```html
+   <!-- Before -->
+   <img src="hero.jpg" />
+
+   <!-- After -->
+   <img
+     src="hero.jpg"
+     srcset="hero-400.webp 400w, hero-800.webp 800w, hero-1200.webp 1200w"
+     sizes="(max-width: 600px) 400px, (max-width: 1200px) 800px, 1200px"
+     loading="eager"
+     fetchpriority="high"
+   />
+   ```
+
+2. **Preload LCP resource**
+
+   ```html
+   <link rel="preload" as="image" href="/hero.webp" fetchpriority="high" />
+   ```
+
+3. **Inline critical CSS**
+
+   ```html
+   <style>
+     /* Above-the-fold styles */
+     .hero {
+       display: flex;
+       height: 100vh;
+     }
+   </style>
+   ```
+
+4. **Use CDN**
+   - Serve images from CloudFront/Cloudflare
+   - Enable HTTP/2 or HTTP/3
+
+## INP Optimization (<200ms)
+
+**Fixes:**
+
+1. **Debounce expensive interactions**
+
+   ```typescript
+   import { debounce } from "lodash";
+
+   const handleSearch = debounce((query) => {
+     fetchResults(query);
+   }, 300);
+   ```
+
+2. **Use Web Workers for heavy tasks**
+
+   ```typescript
+   const worker = new Worker("processor.js");
+   worker.postMessage(largeData);
+   worker.onmessage = (e) => console.log(e.data);
+   ```
+
+3. **Code splitting**
+   ```typescript
+   const HeavyComponent = lazy(() => import("./HeavyComponent"));
+   ```
+
+## CLS Optimization (<0.1)
+
+**Fixes:**
+
+1. **Reserve space for images/ads**
+
+   ```html
+   <img src="banner.jpg" width="1200" height="600" />
+   ```
+
+2. **Use CSS aspect-ratio**
+
+   ```css
+   .video-container {
+     aspect-ratio: 16 / 9;
+   }
+   ```
+
+3. **Avoid injecting content above existing**
+   ```css
+   .notification {
+     position: fixed;
+     top: 0;
+   }
+   ```
+
+## Verification
+
+```bash
+# Lighthouse CI
+npm run lighthouse -- --url=https://example.com
+
+# Web Vitals in production
+import { getCLS, getFID, getLCP } from 'web-vitals';
+
+getCLS(console.log);
+getFID(console.log);
+getLCP(console.log);
+```
+
+## Output Checklist
+
+- [ ] LCP optimized (<2.5s)
+- [ ] INP optimized (<200ms)
+- [ ] CLS optimized (<0.1)
+- [ ] Monitoring in place
+- [ ] Performance regression tests
+      ENDFILE

package/templates/performance/incident-runbook-generator/ SKILL.md

@@ -0,0 +1,162 @@
+---
+name: incident-runbook-generator
+description: Creates step-by-step incident response runbooks for common outages with actions, owners, rollback procedures, and communication templates. Use for "incident runbook", "outage response", "incident management", or "on-call procedures".
+---
+
+# Incident Runbook Generator
+
+Create actionable runbooks for common incidents.
+
+## Runbook Template
+
+````markdown
+# Runbook: Database Connection Pool Exhausted
+
+**Severity:** P1 (Critical)
+**Estimated Time to Resolve:** 15-30 minutes
+**Owner:** Database Team (On-call)
+
+## Symptoms
+
+- Application errors: "connection pool exhausted"
+- Increased API latency (>5s)
+- Failed health checks
+- CloudWatch alarm: `DatabaseConnectionsHigh`
+
+## Detection
+
+- Alert: DatabaseConnectionPoolExhausted
+- Metrics: `active_connections > max_connections * 0.9`
+- Logs: "Error: connect ETIMEDOUT"
+
+## Immediate Actions (5 min)
+
+1. **Verify the issue**
+   ```bash
+   # Check current connections
+   SELECT count(*) FROM pg_stat_activity;
+   ```
+````
+
+2. **Identify long-running queries**
+
+   ```sql
+   SELECT pid, now() - pg_stat_activity.query_start AS duration, query
+   FROM pg_stat_activity
+   WHERE state = 'active'
+   ORDER BY duration DESC
+   LIMIT 10;
+   ```
+
+3. **Kill blocking queries** (if safe)
+   ```sql
+   SELECT pg_terminate_backend(pid)
+   FROM pg_stat_activity
+   WHERE state = 'idle in transaction'
+   AND now() - state_change > interval '5 minutes';
+   ```
+
+## Mitigation (10 min)
+
+1. **Scale up connection pool** (temporary)
+
+   ```bash
+   # Update RDS parameter group
+   aws rds modify-db-parameter-group \
+     --db-parameter-group-name prod-params \
+     --parameters "ParameterName=max_connections,ParameterValue=200"
+   ```
+
+2. **Restart application** (if needed)
+
+   ```bash
+   kubectl rollout restart deployment/api
+   ```
+
+3. **Monitor recovery**
+   ```bash
+   watch -n 5 'psql -c "SELECT count(*) FROM pg_stat_activity;"'
+   ```
+
+## Root Cause Investigation
+
+Check for:
+
+- [ ] Recent deployment (new code with connection leaks)
+- [ ] Traffic spike (legitimate or DDoS)
+- [ ] Slow queries holding connections
+- [ ] Connection pool configuration too small
+- [ ] Application not releasing connections
+
+## Rollback Steps
+
+If caused by deployment:
+
+```bash
+# Rollback to previous version
+kubectl rollout undo deployment/api
+
+# Verify
+kubectl rollout status deployment/api
+```
+
+## Communication Template
+
+**Initial (within 5 min):**
+
+```
+🚨 INCIDENT: Database connection pool exhausted
+Status: Investigating
+Impact: API errors and slowness
+ETA: 15-30 min
+Next update: 10 min
+```
+
+**Update (every 10 min):**
+
+```
+UPDATE: Killed long-running queries
+Status: Mitigating
+Impact: Still degraded, improving
+Actions: Scaling connection pool
+Next update: 10 min
+```
+
+**Resolution:**
+
+```
+✅ RESOLVED: Database connections normalized
+Duration: 25 minutes
+Root cause: Connection leak in v2.3.4
+Fix: Rolled back to v2.3.3
+Follow-up: Bug fix PR #1234
+Postmortem: [link]
+```
+
+## Prevention
+
+- [ ] Add connection pool metrics to dashboards
+- [ ] Implement connection timeout (30s)
+- [ ] Add connection leak detection in tests
+- [ ] Set up pre-deployment load testing
+- [ ] Review connection pool sizing
+
+## Related Runbooks
+
+- Database High CPU
+- Slow Database Queries
+- Application OOM
+
+```
+
+## Output Checklist
+
+- [ ] Symptoms documented
+- [ ] Detection criteria
+- [ ] Step-by-step actions
+- [ ] Owner assigned
+- [ ] Rollback procedure
+- [ ] Communication templates
+- [ ] Prevention measures
+ENDFILE
+```