optimize

Audits and optimizes frontend, backend, and perceived performance against PRD budgets.

4|Updated Mar 14, 2026
One-click install
npx skills add https://github.com/VoxTechnologies/transmute-framework --skill optimize-voxtechnologies
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/VoxTechnologies/transmute-framework/tree/main/skills/optimize
Command: npx skills add https://github.com/VoxTechnologies/transmute-framework --skill optimize-voxtechnologies

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Products often ship with slow page loads, bloated bundles, unindexed queries, and poor Core Web Vitals because performance work is skipped or done without measurement. This Skill runs a structured multi-agent performance audit that measures a baseline, fixes bottlenecks, and verifies compliance against PRD performance budgets. ## Core Features & Use Cases - Baseline Measurement: Builds the production app and records Lighthouse scores and Core Web Vitals (LCP, INP via TBT proxy, CLS) before any changes. - Three Specialized Teammates: Coordinates frontend bundle/rendering optimization, backend index and query efficiency, and perceived performance (skeletons, optimistic updates, progressive loading). - Gate Decision Report: Produces a compliance report with before/after metrics, budget pass/fail tables, and a PASS / CONDITIONAL PASS / FAIL gate decision for downstream pipeline stages. - Use Case: During Stage 6C of the Transmute pipeline, run this Skill to audit a Next.js + Convex app against PRD targets, add missing database indexes, reduce bundle size, and document the results in plancasting/_audits/performance/report.md. ## Quick Start Ask the agent to run a performance audit and optimize the app against the PRD performance budgets.

Frequently Asked Questions about optimize

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I run a performance audit on my web app?

Build the production bundle, start the production server, then run Lighthouse against key pages at least three times and average the scores. Record LCP, TBT as an INP proxy, and CLS in a baseline file before making any optimizations.

How to improve Core Web Vitals like LCP, INP, and CLS?

Target LCP under 2.5s by optimizing above-the-fold content and images, keep TBT under 200ms as a lab proxy for INP, and keep CLS under 0.1 by adding skeleton screens and image dimensions. Measure against production builds, never a dev server.

Why are my Lighthouse scores misleadingly low or high?

Lighthouse run against a development server produces misleading scores because dev mode includes unminified code, HMR, and source maps. Always measure against a production build with default simulated 4G throttling and cold cache.

Does this work with frameworks other than Next.js and Convex?

Yes, the Skill adapts to the stack defined in plancasting/tech-stack.md. Backend directories, schema files, data fetching hooks, and package manager commands are substituted for frameworks like Vite, SvelteKit, or Remix.

When should I not add React.memo or pagination?

Avoid blanket React.memo since it adds comparison overhead; apply it only where expensive re-renders with unchanged props are measured. Skip pagination for lists that will never exceed about 50 items, and never lazy-load above-the-fold content.