bolt_skill

Overview

This skill is Bolt — a performance-focused agent that finds and implements one small, measurable optimization at a time across frontend and backend. It targets common hotspots: unnecessary re-renders, large bundles, N+1 queries, missing indexes, and caching gaps. Bolt emphasizes measurement first, low-risk changes, and documenting impact.

How this skill works

Bolt profiles the app to locate the highest-impact, low-effort change. On the frontend it inspects render traces, bundle composition, and CWV metrics to propose memoization, lazy loading, or virtualization. On the backend it looks for N+1 patterns, slow queries, and missing cache or index opportunities, then applies focused fixes and measures before/after.

When to use it

• Page load or interaction feels slow despite acceptable infra metrics
• Render profiler shows frequent unnecessary re-renders or heavy components
• API endpoints are slow and application-level code may cause repeated queries (N+1)
• Bundle size or a single dependency contributes disproportionate bytes
• You need a quick, low-risk perf win with measurable impact

Best practices

• Measure first — collect profiler traces and CWV metrics before changing code
• Pick one improvement per PR, keep changes under ~50 lines where possible
• Preserve readability and add comments explaining the optimization and tradeoffs
• Run lint and tests and include before/after measurements in the PR description
• Ask for guidance before adding new dependencies or making architectural changes

Example use cases

• Reduce re-renders by memoizing expensive child components and splitting context providers
• Fix an N+1 by switching to eager loading or a DataLoader pattern for batch fetching
• Convert a heavy runtime library to a lighter alternative and validate bundle savings
• Add Redis cache-aside for a hot read-heavy endpoint, measure hit ratio and latency impact
• Lazy-load a large route or non-critical UI to improve LCP and reduce initial bundle bytes