Инструменты

A disciplined process for hard bugs and performance regressions: build a reliable reproduction loop, reproduce and minimize, form hypotheses, instrument to verify, then fix and add a regression test, redacting secrets in output. By Matt Pocock.

Drives a Next.js route to instant navigation under Cache Components: writes a failing @next/playwright instant() e2e test, pushes Suspense boundaries down to grow the static shell until it passes, and keeps the test as a regression guard. Requires Next.js 16.3+ with cacheComponents.

Official Next.js plugin shipped in the vercel/next.js repo: guides enabling and tuning Cache Components and Partial Prefetching, and verifies changes on a running dev server with the Next.js MCP and agent-browser.

Engineering skill collection spanning define, plan, build, verify, review and ship, with /spec, /plan, /build, /test, /review and /ship commands, including TDD, code review and web performance audits. By Addy Osmani.

macOS cleanup and maintenance CLI (mo): clears caches and logs, fully uninstalls apps, analyzes disk usage, removes project build artifacts and shows system status. Preview deletions with --dry-run; disk analysis and status support JSON output. Needs macOS 12+.

Teaches agents to use the Chrome DevTools MCP efficiently: snapshot first to get element uids, screenshot only when needed, paginate and filter large output, inspect CSS and test browser extensions. Needs chrome-devtools-mcp configured; maintained by the Chrome DevTools team.

Lets agents control and inspect a real Chrome: read the console and network requests, take screenshots, and record performance traces with optimization suggestions. Maintained by the Chrome DevTools team.

Official Chrome plugin bundling the Chrome DevTools MCP with debugging skills for accessibility, LCP and memory leaks: lets agents drive and inspect a real Chrome and analyze network requests, console logs and performance traces. Collects usage stats by default; can be disabled.

Vercel's official cost and performance skill: gathers production metrics, usage and project config, investigates only the routes and files the metrics point to, and returns ranked, doc-backed recommendations. Supports Next.js, SvelteKit and Nuxt; needs Vercel CLI v53+ logged in and linked.

React and Next.js performance rules from Vercel's engineering team: 70 rules ranked by impact covering request waterfalls, bundle size, server performance and re-renders, for writing, reviewing and refactoring. Maintained by Vercel.

Vercel's React Native and Expo best practices ranked by impact, covering list scrolling performance, Reanimated animations, navigation, UI patterns, state management and monorepo setup. Maintained by Vercel.

Official web auditing tool from the Google Chrome team: score pages on performance, accessibility, best practices and SEO from the command line and get HTML, JSON or CSV reports, so agents can iterate on a page. Needs Node 22+ and Chrome.

SVG optimizer CLI and Node.js library: shrinks SVGs by removing editor metadata, comments, hidden elements and redundant attributes, processes whole directories recursively, and gives fine control through plugin config.

GSAP's official animation skills: teach agents to use the core API, timelines, ScrollTrigger and plugins correctly, including React, Vue and Svelte integration and animation performance. Maintained by GreenSock; all plugins are free.

Audits a whole React codebase read-only: runs a React Doctor scan as evidence, vets findings across bugs, performance, accessibility, security and maintainability, ranks them by leverage, then writes self-contained plans other agents can execute. Never edits source.

Hands your current browser session to the agent through a Chrome extension: read console logs and network requests, take screenshots, and run Lighthouse performance, accessibility and SEO audits without signing in again.

Guides the agent to build a coherent, product-grade web motion system in the style of Stripe, Linear, Apple and Vercel: reusable primitives, duration and easing defaults, stagger choreography, scroll and hover patterns, performance rules and reduced-motion support.

Lossy PNG compression CLI: converts images to 8-bit PNGs that keep transparency, usually 60-80% smaller, with batch processing and a quality range setting. Handy for slimming down web assets, slides and article images. Install via Homebrew on macOS; no account.

Font toolkit: pyftsubset subsets fonts to the characters you use and outputs WOFF2 to shrink web fonts, and ttx converts fonts to editable XML for inspection and edits. Needs Python 3.11+ and the woff extra for WOFF2; check the license before subsetting commercial fonts.

Runs Google Lighthouse across an entire site (sampling similar pages smartly) and summarizes SEO, performance and accessibility scores page by page in a local web UI; unlighthouse-ci writes reports directly for agents to read. Great for site-wide SEO checkups. Needs Node.js 22.18+.

Measurement-first audits and optimization of web quality using Lighthouse, Chrome DevTools performance traces and CrUX data, covering Core Web Vitals, WCAG 2.2 accessibility, SEO and best practices, for any frontend framework. By Addy Osmani (not an official Google project).

Gives agents on-demand guidance for the modern web platform, covering View Transitions, container queries, Popover, INP optimization, accessibility and more, with browser compatibility data so they avoid outdated code. Maintained by the Google Chrome team; currently in preview.

SDK and CLI for reading, editing and optimizing glTF 2.0 3D models: one optimize command does it all, or run Draco and Meshopt geometry compression, texture resizing and WebP or KTX2 compression separately. Suits game and web 3D assets.

Command-line tool for inspecting, compressing and optimizing glTF/GLB 3D models, with Draco and Meshopt mesh compression, texture resizing and WebP/KTX2 compression; a single optimize command handles it all.