vercel-optimize
๐ฏSkillfrom vercel-labs/agent-skills
Installation
npx vibeindex add vercel-labs/agent-skills --skill vercel-optimizenpx skills add vercel-labs/agent-skills --skill vercel-optimize~/.claude/skills/vercel-optimize/SKILL.md
|A collection of AI agent skills from Vercel Labs covering React/Next.js performance optimization, web design accessibility auditing, React Native best practices, and View Transition API implementation.
Overview
This skill audits deployed Vercel projects for cost, performance, reliability, caching, and function usage. It takes a metrics-first approach: collecting Vercel deployment data first, then investigating only the specific routes and files those metrics point to. The result is a ranked report with actionable optimization recommendations rather than generic best practices.
Key Features
- Metrics-driven auditing: Starts from actual Vercel deployment metrics to identify expensive or slow routes, ensuring recommendations target real bottlenecks rather than theoretical issues.
- Cost optimization: Analyzes function invocations, execution duration, and billing patterns to find opportunities for reducing Vercel spend, including ISR, caching, and middleware improvements.
- Performance analysis: Identifies slow routes, inefficient caching configurations, image optimization gaps, and build-minute waste across the entire project.
- Ranked reporting: Produces a prioritized list of findings sorted by impact, so teams can focus on changes that deliver the most improvement first.
- Comprehensive coverage: Examines serverless and edge function usage, CDN cache hit rates, ISR/PPR configuration, middleware overhead, image delivery, and build pipeline efficiency in a single audit pass.
Who is this for?
- DevOps engineers and platform teams responsible for managing Vercel deployment costs and performance across multiple projects.
- Full-stack developers who want to optimize their Vercel-hosted applications but are unsure where the biggest gains are.
- Engineering leads preparing for traffic scaling who need a clear picture of current infrastructure efficiency and potential bottlenecks.
- Teams migrating to or expanding on Vercel who want to ensure their configuration follows cost-effective patterns from the start.
Same repository
vercel-labs/agent-skills(18 items)
SKILL.md
More from this repository10
React and Next.js performance optimization guidelines from Vercel Engineering. 40+ rules across 8 categories covering component performance, data fetching, and bundle size optimization.
Web interface best practices auditor from Vercel Engineering. Reviews UI code against 100+ standards covering accessibility, animations, forms, images, and UX fundamentals.
React composition patterns skill from Vercel Labs that helps avoid boolean prop proliferation through compound components, state lifting, and internal composition techniques.
React Native best practices skill with 16 rules across 7 sections covering performance, layout, animation, images, state management, architecture, and platform-specific patterns for Expo and React Native apps.
Part of Vercel Labs agent skills collection that includes React/Next.js best practices, web design guidelines, React Native guidelines, and composition patterns โ packaged as Agent Skills for AI coding agents.
Implements smooth animations using React's View Transition API โ the `<ViewTransition>` component, `addTransitionType`, transition classes, shared-element transitions, and Next.js `next/link` integration.
A skill from the Vercel Labs agent-skills collection that enables AI coding agents to interact with the Vercel CLI using authentication tokens for deployment and project management.
Reviews documentation and prose against Vercel's writing handbook, auditing 80+ rules across voice, structure, content types, code samples, typography, and AI workflow.
Guides AI agents in implementing robust software design patterns for component composition, modularity, and reusability across different programming paradigms.
React Native best practices optimized for AI agents from Vercel Engineering. 16 rules across 7 sections covering mobile performance, layout patterns, animations, and platform-specific implementation.