Vercel Optimize Audit
vercel-labs/agent-skills
Runs a metrics-first audit of a deployed Vercel project, gating investigations on real signals to produce ranked, citation-backed cost and performance recommendations.
Runs agent-browser with headless Chrome inside Vercel Sandbox microVMs so Vercel-deployed apps can automate a browser without binary size limits.
$ npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install vercel-labs/agent-browser vercel-sandbox --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/vercel-labs/agent-browser.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skill-data/vercel-sandbox .claude/skills/vercel-sandbox && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "vercel-sandbox" agent skill from https://github.com/vercel-labs/agent-browser/tree/main/skill-data/vercel-sandbox into .claude/skills/vercel-sandbox/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vercel-sandbox", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/vercel-labs/agent-browser/tree/main/skill-data/vercel-sandboxType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install vercel-labs/agent-browser vercel-sandbox --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/vercel-labs/agent-browser.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skill-data/vercel-sandbox .agents/skills/vercel-sandbox && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "vercel-sandbox" agent skill from https://github.com/vercel-labs/agent-browser/tree/main/skill-data/vercel-sandbox into .agents/skills/vercel-sandbox/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vercel-sandbox", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install vercel-labs/agent-browser vercel-sandbox --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/vercel-labs/agent-browser.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skill-data/vercel-sandbox .cursor/skills/vercel-sandbox && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "vercel-sandbox" agent skill from https://github.com/vercel-labs/agent-browser/tree/main/skill-data/vercel-sandbox into .cursor/skills/vercel-sandbox/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vercel-sandbox", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/vercel-labs/agent-browser.git --path skill-data/vercel-sandbox--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install vercel-labs/agent-browser vercel-sandbox --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/vercel-labs/agent-browser.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skill-data/vercel-sandbox .gemini/skills/vercel-sandbox && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "vercel-sandbox" agent skill from https://github.com/vercel-labs/agent-browser/tree/main/skill-data/vercel-sandbox into .gemini/skills/vercel-sandbox/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vercel-sandbox", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install vercel-labs/agent-browser vercel-sandboxInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/vercel-labs/agent-browser.git skills-src && mkdir -p .github/skills && cp -r skills-src/skill-data/vercel-sandbox .github/skills/vercel-sandbox && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "vercel-sandbox" agent skill from https://github.com/vercel-labs/agent-browser/tree/main/skill-data/vercel-sandbox into .github/skills/vercel-sandbox/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vercel-sandbox", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install vercel-labs/agent-browser vercel-sandbox --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/vercel-labs/agent-browser.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skill-data/vercel-sandbox .opencode/skills/vercel-sandbox && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "vercel-sandbox" agent skill from https://github.com/vercel-labs/agent-browser/tree/main/skill-data/vercel-sandbox into .opencode/skills/vercel-sandbox/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "vercel-sandbox", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
vercel-sandboxRuns agent-browser with headless Chrome inside Vercel Sandbox microVMs so Vercel-deployed apps can automate a browser without binary size limits.
This skill shows how to run the agent-browser CLI and headless Chrome inside ephemeral Vercel Sandbox microVMs, so an app deployed on Vercel can drive a browser without hitting binary size limits. A Linux VM starts on demand, runs the browser commands, then shuts down. It works with any framework deployed on Vercel, such as Next.js, SvelteKit, Nuxt, Remix or Astro.
The pattern uses the @agent-browser/sandbox and @vercel/sandbox packages, installed with pnpm, and TypeScript helpers such as createAgentBrowserSnapshot and runAgentBrowserCommand. Examples cover screenshots saved to a file and read back as base64, accessibility-tree snapshots, and multi-step flows such as filling and submitting a form in a sandbox that stays alive between commands. A sandbox snapshot, a saved VM image with system dependencies, agent-browser and Chromium preinstalled, cuts startup from about 30 seconds to under a second, and its ID goes in the AGENT_BROWSER_SNAPSHOT_ID environment variable.
Read from SKILL.md and the folder at commit 0207911. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
pnpmnpxFrom the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md. Its commands use pnpm and npx, which can reach the network depending on how they are called.
From URLs in SKILL.md, links to its own repository left out.
Names these keys or tokens, usually read from environment variables:
VERCEL_TOKENVERCEL_OIDC_TOKENFrom names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Vercel Sandbox Browser loads about 2k tokens when it runs. Until then it costs about 140 tokens; SKILL.md has 416 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from vercel-labs/agent-browser at commit 0207911, republished under its Apache-2.0 licence (© vercel-labs). 416 words, ~1,972 tokens.
.claude/skills/vercel-sandbox/SKILL.md (or your agent's skills folder).Run agent-browser + headless Chrome inside ephemeral Vercel Sandbox microVMs. A Linux VM spins up on demand, executes browser commands, and shuts down. Works with any Vercel-deployed framework (Next.js, SvelteKit, Nuxt, Remix, Astro, etc.).
pnpm add @agent-browser/sandbox @vercel/sandboxThe sandbox VM needs system dependencies for Chromium plus agent-browser itself. The @agent-browser/sandbox helpers install them by default for fresh sandboxes and use sandbox snapshots (below) for sub-second startup. Pass installSystemDependencies: false only when the sandbox image already provides Chromium's required libraries.
import {
createAgentBrowserSnapshot,
runAgentBrowserCommand,
withAgentBrowserSandbox,
type VercelSandboxSession,
} from "@agent-browser/sandbox/vercel";
async function withBrowser<T>(
fn: (sandbox: VercelSandboxSession) => Promise<T>,
): Promise<T> {
return withAgentBrowserSandbox(fn);
}The screenshot --json command saves to a file and returns the path. Read the file back as base64:
export async function screenshotUrl(url: string) {
return withBrowser(async (sandbox) => {
await runAgentBrowserCommand(sandbox, ["open", url]);
const titleResult = await runAgentBrowserCommand<{ data?: { title?: string } }>(sandbox, [
"get", "title",
]);
const title = titleResult.json?.data?.title || url;
const ssResult = await runAgentBrowserCommand<{ data?: { path?: string } }>(sandbox, [
"screenshot",
]);
const ssPath = ssResult.json?.data?.path;
if (!ssPath) throw new Error("Screenshot did not return a file path.");
const b64Result = await sandbox.runCommand("base64", ["-w", "0", ssPath]);
const screenshot = (await b64Result.stdout()).trim();
await runAgentBrowserCommand(sandbox, ["close"], { json: false });
return { title, screenshot };
});
}export async function snapshotUrl(url: string) {
return withBrowser(async (sandbox) => {
await runAgentBrowserCommand(sandbox, ["open", url]);
const titleResult = await runAgentBrowserCommand<{ data?: { title?: string } }>(sandbox, [
"get", "title",
]);
const title = titleResult.json?.data?.title || url;
const snapResult = await runAgentBrowserCommand(sandbox, ["snapshot", "-i", "-c"], {
json: false,
});
await runAgentBrowserCommand(sandbox, ["close"], { json: false });
return { title, snapshot: snapResult.stdout };
});
}The sandbox persists between commands, so you can run full automation sequences:
export async function fillAndSubmitForm(
url: string,
data: Record<string, string>,
postSubmitWaitArgs: string[],
) {
return withBrowser(async (sandbox) => {
await runAgentBrowserCommand(sandbox, ["open", url]);
const snapResult = await runAgentBrowserCommand(sandbox, ["snapshot", "-i"], {
json: false,
});
const snapshot = snapResult.stdout;
// Parse snapshot to find element refs...
for (const [ref, value] of Object.entries(data)) {
await runAgentBrowserCommand(sandbox, ["fill", ref, value]);
}
await runAgentBrowserCommand(sandbox, ["click", "@e5"]);
// Pass an app-specific wait, such as ["--url", "**/checkout/complete"],
// ["--text", "Thanks"], or ["#confirmation"].
await runAgentBrowserCommand(sandbox, ["wait", ...postSubmitWaitArgs]);
const ssResult = await runAgentBrowserCommand<{ data?: { path?: string } }>(sandbox, [
"screenshot",
]);
const ssPath = ssResult.json?.data?.path;
if (!ssPath) throw new Error("Screenshot did not return a file path.");
const b64Result = await sandbox.runCommand("base64", ["-w", "0", ssPath]);
const screenshot = (await b64Result.stdout()).trim();
await runAgentBrowserCommand(sandbox, ["close"], { json: false });
return { screenshot };
});
}A sandbox snapshot is a saved VM image of a Vercel Sandbox with system dependencies + agent-browser + Chromium already installed. Think of it like a Docker image: instead of installing dependencies from scratch every time, the sandbox boots from the pre-built image.
This is unrelated to agent-browser's accessibility snapshot feature (agent-browser snapshot), which dumps a page's accessibility tree. A sandbox snapshot is a Vercel infrastructure concept for fast VM startup.
Without a sandbox snapshot, each run installs system deps + agent-browser + Chromium (~30s). With one, startup is sub-second.
The snapshot must include system dependencies (via dnf), agent-browser, and Chromium:
const snapshotId = await createAgentBrowserSnapshot();Run this once, then set the environment variable:
AGENT_BROWSER_SNAPSHOT_ID=snap_xxxxxxxxxxxxA helper script is available in the demo app:
npx tsx examples/environments/scripts/create-snapshot.tsRecommended for any production deployment using the Sandbox pattern.
On Vercel deployments, the Sandbox SDK authenticates automatically via OIDC. For local development or explicit control, set:
VERCEL_TOKEN=<personal-access-token>
VERCEL_TEAM_ID=<team-id>
VERCEL_PROJECT_ID=<project-id>These are spread into Sandbox.create() calls. When absent, the SDK falls back to VERCEL_OIDC_TOKEN (automatic on Vercel).
Combine with Vercel Cron Jobs for recurring browser tasks:
// app/api/cron/route.ts (or equivalent in your framework)
export async function GET() {
const result = await withBrowser(async (sandbox) => {
await sandbox.runCommand("agent-browser", ["open", "https://example.com/pricing"]);
const snap = await sandbox.runCommand("agent-browser", ["snapshot", "-i", "-c"]);
await sandbox.runCommand("agent-browser", ["close"]);
return await snap.stdout();
});
// Process results, send alerts, store data...
return Response.json({ ok: true, snapshot: result });
}// vercel.json
{ "crons": [{ "path": "/api/cron", "schedule": "0 9 * * *" }] }| Variable | Required | Description |
|---|---|---|
AGENT_BROWSER_SNAPSHOT_ID | No (but recommended) | Pre-built sandbox snapshot ID for sub-second startup (see above) |
VERCEL_TOKEN | No | Vercel personal access token (for local dev; OIDC is automatic on Vercel) |
VERCEL_TEAM_ID | No | Vercel team ID (for local dev) |
VERCEL_PROJECT_ID | No | Vercel project ID (for local dev) |
The pattern works identically across frameworks. The only difference is where you put the server-side code:
| Framework | Server code location |
|---|---|
| Next.js | Server actions, API routes, route handlers |
| SvelteKit | +page.server.ts, +server.ts |
| Nuxt | server/api/, server/routes/ |
| Remix | loader, action functions |
| Astro | .astro frontmatter, API routes |
See examples/environments/ in the agent-browser repo for a working app with the Vercel Sandbox pattern, including a sandbox snapshot creation script, streaming progress UI, and rate limiting.
© vercel-labs, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in skill-data/vercel-sandbox of vercel-labs/agent-browser.
Open the folder on GitHubat commit 0207911
Vercel Sandbox Browser next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Vercel Sandbox Browser this skillvercel-labs/agent-browser | 44k | — | ~2k | Automated safety check: Pass | Apache-2.0 | |
| Vercel Optimize Auditvercel-labs/agent-skills | 32k | 8 repos | ~4.3k | Automated safety check: Pass | None | |
| Cloudflare Workers Frameworkssecondsky/claude-skills | 227 | — | ~1.4k | Automated safety check: Pass | MIT | |
| Sanity Best Practicesrobotostudio/turbo-start-sanity | 183 | — | ~940 | Automated safety check: Pass | MIT | |
| Sanity Best Practicessanity-io/agent-toolkit | 188 | — | ~1.3k | Automated safety check: Pass | MIT | |
| Framework Adaptershashgraph-online/awesome-codex-plugins | 1.3k | — | ~2.9k | Automated safety check: Notes | Apache-2.0 |
vercel-labs/agent-skills
Runs a metrics-first audit of a deployed Vercel project, gating investigations on real signals to produce ranked, citation-backed cost and performance recommendations.
secondsky/claude-skills
Framework integration for Cloudflare Workers. An agent skill from secondsky/claude-skills.
robotostudio/turbo-start-sanity
Sanity development best practices for schema design, GROQ queries, TypeGen, Visual Editing, images, Portable Text, Studio structure, localization, migrations, Sanity Functions, Blueprints, and…
sanity-io/agent-toolkit
Sanity development best practices for schema design, GROQ queries, TypeGen, Visual Editing, images, Portable Text, Studio structure, localization, migrations, Sanity Functions, webhooks, Blueprints…
hashgraph-online/awesome-codex-plugins
Official @dodopayments/ framework adapters that mount Checkout, CustomerPortal, and Webhooks route handlers.
TencentEdgeOne/edgeone-makers-tools
Web framework support matrix for EdgeOne Makers — which platform adapter each full-stack framework needs, where it plugs in, the build output directory, the preview asset-prefix option, the 404…
vercel-labs/agent-browser
Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking…
vercel-labs/agent-browser
Explores a web app with the agent-browser CLI to find bugs and UX problems, then writes a report with screenshots, repro videos and step-by-step reproduction for each issue.
vercel-labs/agent-browser
Automates Electron desktop apps such as VS Code, Slack or Discord by connecting agent-browser to their Chrome DevTools Protocol port.
vercel-labs/agent-browser
Drives the Slack web app with the agent-browser CLI to check unread channels, search, read channel details and extract information, with screenshots as evidence.
vercel-labs/agent-browser
Core usage guide for the agent-browser CLI: the snapshot-and-ref workflow for navigating, clicking, filling forms, extracting data and running parallel sessions.
vercel-labs/agent-browser
Records a site's browser traffic into a HAR file, then builds a standalone client or CLI that calls its internal endpoints directly with no browser.
Categories
Runs agent-browser with headless Chrome inside Vercel Sandbox microVMs so Vercel-deployed apps can automate a browser without binary size limits. This skill shows how to run the agent-browser CLI and headless Chrome inside ephemeral Vercel Sandbox microVMs, so an app deployed on Vercel can drive a browser without hitting binary size limits. A Linux VM starts on demand, runs the browser commands, then shuts down.
Vercel Sandbox Browser fits situations like: adding browser automation to an app deployed on Vercel; running headless Chrome where binary size limits block it; keeping a browser session alive across several commands; needing an isolated, throwaway browser environment per task.
Run `npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a claude-code`. Or copy the skill folder (skill-data/vercel-sandbox in vercel-labs/agent-browser) into .claude/skills/vercel-sandbox in your project. Claude Code loads it when a task matches its description.
Run `npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a codex`. Or copy the skill folder (skill-data/vercel-sandbox in vercel-labs/agent-browser) into .agents/skills/vercel-sandbox in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add vercel-labs/agent-browser --skill vercel-sandbox -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/vercel-sandbox, .gemini/skills/vercel-sandbox, .github/skills/vercel-sandbox and .opencode/skills/vercel-sandbox in your project.
Going by SKILL.md and its folder, Vercel Sandbox Browser needs the command-line tools its instructions call (pnpm and npx) and credentials named VERCEL_TOKEN and VERCEL_OIDC_TOKEN. Our summary lists: A Vercel project with access to Vercel Sandbox; The @agent-browser/sandbox and @vercel/sandbox packages.
SKILL.md contains no URLs. Its commands use npx, which can reach the network depending on how they are called. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Vercel Sandbox Browser is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 2k tokens (SKILL.md is roughly 7.9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Vercel Sandbox Browser: Vercel Optimize Audit (vercel-labs/agent-skills, 32k stars), Cloudflare Workers Frameworks (secondsky/claude-skills, 227 stars), Sanity Best Practices (robotostudio/turbo-start-sanity, 183 stars) and Sanity Best Practices (sanity-io/agent-toolkit, 188 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
vercel-labs (a GitHub organization, an official publisher) maintains it in vercel-labs/agent-browser, which has 43,705 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on October 8, 2026.
Source: vercel-labs/agent-browser on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.