# Qa Perf

> Application performance optimization. Trigger when the user wants to improve speed, reduce latency, or optimize resources.

- **Type:** Skill
- **Install:** `agentstack add skill-christopherlouet-claude-base-qa-perf`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [christopherlouet](https://agentstack.voostack.com/s/christopherlouet)
- **Installs:** 0
- **Category:** [AI & ML](https://agentstack.voostack.com/c/ai-and-ml)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [christopherlouet](https://github.com/christopherlouet)
- **Source:** https://github.com/christopherlouet/claude-base/tree/main/.claude/skills/qa-perf
- **Website:** https://christopherlouet.github.io/claude-base/

## Install

```sh
agentstack add skill-christopherlouet-claude-base-qa-perf
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Performance Optimization (pointer)

Canonical thresholds, current Web Vitals (LCP/INP/CLS — note INP replaced FID in 2024), and Chrome perf-team remediation patterns are at:

- **`addyosmani/web-quality-skills`** — [github.com/addyosmani/web-quality-skills](https://github.com/addyosmani/web-quality-skills) (MIT, 1.8k★, maintained by Addy Osmani — Chrome DevTools / Lighthouse engineering lead). Covers Core Web Vitals, perf, a11y, SEO.
- **web.dev/vitals** — [web.dev/vitals](https://web.dev/vitals) (Google's canonical Web Vitals reference)
- **Vercel React best practices** — see `vercel-react-best-practices` skill (foundation-installed) for React-specific patterns

## Foundation workflow (when to invoke this skill)

`qa-perf` is dispatched by `qa-loop` during the AUDIT phase, in parallel with `qa-security` / `wcag-audit` / `qa-claudemd`. It's a **measurement workflow**, not an optimisation cookbook:

1. **Measure first**: run Lighthouse / WebPageTest / DevTools Performance against a *known scope* (the URL, page, or endpoint from `argument-hint`).
2. **Compare to canonical thresholds** (see table below).
3. **Identify the bottleneck axis**: render-blocking JS? N+1 DB query? Image weight? Bundle size? Each axis has a dedicated vendor remediation guide.
4. **Recommend with quantified impact** (e.g. "lazy-loading hero image saves ~400ms LCP per Lighthouse run #3").
5. **Re-measure after the fix** — a perf change without before/after numbers is theatre.

## Canonical Web Vitals thresholds (2024-2026)

| Metric | Good | Needs improvement | Poor | Tool |
|---|---|---|---|---|
| **LCP** (Largest Contentful Paint) |  4s | Lighthouse, web-vitals |
| **INP** (Interaction to Next Paint, replaces FID) |  500ms | web-vitals |
| **CLS** (Cumulative Layout Shift) |  0.25 | Lighthouse, web-vitals |
| **TTFB** |  600ms | DevTools Network |

## Foundation discipline (keep across releases)

- **No optimisation without measurement**: profile before changing code. Guessed bottlenecks are wrong ~70% of the time.
- **Before/after numbers mandatory**: every perf PR must include the Lighthouse delta or equivalent. Without numbers, the work is unprovable.
- **Cache invalidation > caching**: adding a cache is easy; correctly invalidating it is the bug surface. Surface cache TTLs in code review.
- **N+1 is the #1 backend perf bug**: when an endpoint feels slow, instrument query count before optimising anything else.

## See also

- `qa-chrome` skill — DevTools manual review (paired layer)
- `dev-react-perf` skill — React-specific re-render audit + memoization patterns
- `ops-monitoring` — production perf instrumentation (OTEL, RUM)
- `vercel-react-best-practices` skill (foundation-installed)
- Audit pilot trace: `specs/marketplace-audit/qa-skills-pilot-2026-05-06.md`

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [christopherlouet](https://github.com/christopherlouet)
- **Source:** [christopherlouet/claude-base](https://github.com/christopherlouet/claude-base)
- **License:** MIT
- **Homepage:** https://christopherlouet.github.io/claude-base/

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-christopherlouet-claude-base-qa-perf
- Seller: https://agentstack.voostack.com/s/christopherlouet
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.