Agent-Skills.md

Agent Skills: Chrome DevTools Optimizer Skill

Use this skill to reduce token consumption by 70-80% when using the Chrome DevTools MCP. Applies a snapshot-first strategy (text over images) with decision trees and pattern guides for navigation, forms, debugging, and visual checks, plus optional Gemini Flash vision processing for the cases that genuinely need an image.

UncategorizedID: diegocconsolini/ClaudeSkillCollection/chrome-devtools-optimizer

Repository

diegocconsolini/ClaudeSkillCollection
diegocconsoliniLicense: MIT
6

Install this agent skill to your local

pnpm dlx add-skill https://github.com/diegocconsolini/ClaudeSkillCollection/tree/HEAD/chrome-devtools-optimizer

Skill Files

Browse the full folder contents for chrome-devtools-optimizer.

Download Skill

Loading file tree…

chrome-devtools-optimizer/SKILL.md

Skill Metadata

Name
chrome-devtools-optimizer
Description
Use this skill to reduce token consumption by 70-80% when using the Chrome DevTools MCP. Applies a snapshot-first strategy (text over images) with decision trees and pattern guides for navigation, forms, debugging, and visual checks, plus optional Gemini Flash vision processing for the cases that genuinely need an image.

Chrome DevTools Optimizer Skill

Cuts token cost when driving the Chrome DevTools MCP by preferring text snapshots over screenshots and only escalating to vision when necessary.

Usage

Consult the pattern guides in patterns/ and the token-cost reference in references/ when performing browser automation:

  • Snapshot-first: read the accessibility/text snapshot before taking a screenshot.
  • Decision trees: navigation, forms, and debugging flows that minimize image captures.
  • Optional Gemini Flash: for true visual analysis, scripts/process-screenshot.js sends one image to Gemini Flash (~$0.001) instead of round-tripping a large screenshot.
# one-time: configure the Gemini API key (read from
# ~/.config/chrome-devtools-optimizer/config.json — never hardcoded)
node scripts/process-screenshot.js <image-path-or-base64>

See agents/chrome-devtools-optimizer.md for the full decision logic.