Charlotte vs Playwright MCP

Both Charlotte and Playwright MCP give AI agents the ability to browse the web. The difference is cost. Charlotte is a token-efficient browser MCP that returns ~10–140x less data on real websites — saving thousands of dollars across production workloads.

Why response size matters

Every character an MCP server returns enters the AI agent's context window as input tokens. Playwright MCP sends the full accessibility snapshot on every call — whether the agent needs the entire page or just a single button. On a Wikipedia article, that's over a million characters per navigation.

Charlotte takes a different approach. It defaults to minimal detail on navigation — a compact summary with interactive element counts per landmark region. When the agent needs more, it asks for it with observe or find. This demand-driven model means agents only pay for the context they actually use.

If you're evaluating a Playwright MCP alternative for cost-sensitive or high-volume agent workflows, the numbers below tell the story.

Response size: navigate

Characters returned when an agent first lands on a page. Charlotte defaults to minimal detail; Playwright returns the full accessibility tree. Measured on Charlotte v0.8.0 and Playwright MCP v0.0.79, 2026-08-08.

Wikipedia (AI article)51x smaller
Charlotte
22,134
Playwright
1,137,928
Hacker News139x smaller
Charlotte
364
Playwright
50,706
GitHub repository10x smaller
Charlotte
3,778
Playwright
38,983
LinkedIn (logged out)(measured on an earlier version (v0.4.0-era))7.3x smaller
Charlotte
3,404
Playwright
24,712

What this means in practice: A Playwright agent reading Hacker News headlines receives 50,706 characters of accessibility tree data. A Charlotte agent gets 364 characters — enough to see the page structure and landmarks — then calls find({ type: "link" }) to retrieve exactly the links it needs. The agent decides what level of detail is worth paying for.

Cost per 100-page session

Input token cost for a 100-page browsing session at Hacker News complexity. Charlotte uses the default browse profile (23 tools); Playwright loads all tools on every call (24 tools).

ModelCharlottePlaywrightYou save
Claude Sonnet 5$0.03$3.82$3.80
Claude Opus 5$0.05$6.37$6.33
GPT-5.6 Terra$0.02$2.55$2.53
Claude Haiku 4.5$0.01$1.27$1.27
Input token costs only. 100 navigate calls at Hacker News page complexity.

With tiered tool profiles, Charlotte further reduces overhead. The default browse profile loads 23 tools instead of 43, cutting tool definition tokens by ~49%. The core profile (7 tools) cuts definition overhead by ~75%.

Feature comparison

Charlotte v0.8.0 (43 tools) vs Playwright MCP (24 tools). Both are open-source MCP servers for browser automation. The capability overlap is substantial — the difference is in design philosophy.

FeatureCharlottePlaywright
Detail level controlYesNo
Stable hash-based element IDsYesNo
Structural diff toolYesNo
Semantic findYesNo
Form structure extractionYesNo
Accessibility auditsYesNo
Tiered tool profilesYesNo
Element bounding boxesYesNo
Async condition pollingYesYes
Console message retrievalYesYes
Network request monitoringYesYes
Dialog handlingYesYes
Drag and dropYesYes
Tab managementYesYes
JavaScript evaluationYesYes
Screenshot captureYesYes
File uploadNoYes
Coordinate-based interactionNoYes
PDF generationNoYes
Testing assertionsNoYes
Multi-browser enginesNoYes
Trace recordingNoYes

Where each tool wins

Choose Charlotte when

  • Token cost matters. Long browsing sessions, high-volume pipelines, or expensive models where every input token adds up.
  • Agents need surgical precision. Semantic find, detail levels, and structural diffs let agents request exactly the data they need instead of parsing a full page dump.
  • Accessibility is a priority. Built-in a11y audits and form structure extraction help agents understand page semantics, not just raw DOM.
  • You want stable references. Hash-based element IDs survive re-renders. No more broken selectors when the DOM shifts.
  • Context window headroom. Smaller responses leave more room for agent reasoning, tool results from other sources, and longer conversations.

Choose Playwright MCP when

  • You need file uploads. Playwright MCP has a dedicated file upload tool. Charlotte doesn't yet.
  • Cross-browser testing matters. Playwright supports Chrome, Firefox, and WebKit. Charlotte runs on Chromium only.
  • Vision-based interaction. Playwright's vision group provides coordinate-based tools for canvas elements and non-accessible UIs.
  • You need trace recording. Playwright can record browser traces and video for debugging test failures.
  • Built-in test assertions. Five verification tools for checking element visibility, text content, and values.

Different design, different strengths

Playwright MCP was built by the Playwright team to expose their browser automation engine over MCP. It gives agents the full page state on every call — comprehensive, but expensive when the agent only needs a fraction of it.

Charlotte was designed from scratch as a token-efficient browser MCP. Every response is structured around what agents actually need at each step: a minimal overview on arrival, targeted queries for specific elements, and full detail only when explicitly requested. This demand-driven model can reduce input token costs by 96–99% on content-heavy pages.

Charlotte also introduces capabilities that Playwright MCP doesn't offer: structural diffs between page states, semantic search across the accessibility tree, form structure extraction with grouped fields and labels, and tiered tool profiles that reduce tool definition overhead by up to 77%.

Tool definition overhead

MCP tool definitions are sent as input tokens on every API call. More tools means higher per-call overhead — even when the agent doesn't use them. Charlotte's tiered profiles let you control this cost.

ConfigurationToolsTokens/callvs Full
Charlotte full438,500
Charlotte browse (default)234,37249% less
Charlotte core72,18675% less
Token estimates based on definition character count / 3.5 (schema-dense JSON). Playwright MCP does not offer tool subsetting.

Release drift

Orientation cost (the navigate response) and tool-definition size for every Charlotte release, v0.2.0v0.8.0, measured same-day against the same three live pages, alongside a same-day Playwright MCP 0.0.79 baseline.

Hacker NewsWikipediaGitHubPlaywright 0.0.79 baseline
Navigate-response tokens per Charlotte release, three pages, log scale, with the Playwright baseline shown at right1001,00010,00084848484858591597597642642690701707561430460460503511518v0.2.0v0.3.0v0.4.2v0.5.1v0.6.3v0.7.0v0.8.0playwright(0.0.79)

Playwright 0.0.79 baseline (browser_snapshot): Hacker News 12,540 · Wikipedia 15,849 · GitHub 8,270

View chart data as a table
VersionHacker NewsWikipediaGitHub
v0.2.084597561
v0.3.084597430
v0.4.284642460
v0.5.184642460
v0.6.385690503
v0.7.085701511
v0.8.091707518
playwright (0.0.79)12,54015,8498,270

Takeaway: orientation cost moved 8491 tokens on Hacker News across six releases, while tool-definition size was cut by roughly 29% from its v0.3.0 peak (5,412 → 3,825 tokens) and has held roughly flat since.

Tool-definition size per version

v0.2.0
4,808
32 tools
v0.3.0
5,412
36 tools
v0.4.2
3,616
23 tools
v0.5.1
3,887
23 tools
v0.6.3
3,979
23 tools
v0.7.0
4,187
23 tools
v0.8.0
3,825
23 tools
playwright
4,626
24 tools

Run date 2026-08-09. Tokens ≈ chars/4. Measured same-day against live pages — all versions are re-measured together each release, and rows from different run dates are never mixed. npm-installed historical versions float to whatever Puppeteer/Chromium build was current on the run date, per their loose semver ranges; per-row browser builds are recorded in the published drift.json.

Cost per task

A single navigate call is a convenient number, but it isn't what an agent actually pays for real work. Per-task totals — every call in a realistic sequence, summed — are the more honest measure. Each server got its own most efficient reasonable call path for each task; nobody was handicapped. The exact sequences and full methodology are published in the repo's benchmarks/results/tasks/2026-08-09.

Tool-definition cost (one-time per session, not per task) is excluded from these totals — see Release drift above.

TaskCharlotte 0.8.0Playwright 0.0.79Ratio
orient-and-read7,812 tok / 2 calls12,601 tok / 2 calls1.6× cheaper
find-and-act421 tok / 3 calls13,022 tok / 3 calls31× cheaper
form-fill5,136 tok / 7 calls991 tok / 4 calls5× more expensive
Charlotte currently returns the full page representation after every mutating call. Measured on this same-page form-fill sequence, that's ~96% redundant — most of each response repeats content the action didn't touch. v0.9's delta-first responses target exactly this.

Try Charlotte

Charlotte is open-source, MIT-licensed, and available on npm. Use it as a local stdio MCP server, or self-host Charlotte Remote to connect from claude.ai.

Claude Code / any stdio MCP client

# Install
npx @ticktockbent/charlotte@latest

Add it to .mcp.json or claude_desktop_config.json and it runs over stdio — no separate server to manage.

Self-host Charlotte Remote for claude.ai

# Self-host Charlotte Remote
docker run --cap-add SYS_ADMIN --shm-size 2g -p 3737:3737 ghcr.io/ticktockbent/charlotte

Stands up a public tunnel URL and an operator token, and prints the connector strings for claude.ai — paste the URL into Settings → Connectors → Add custom connector, leave OAuth Client ID/Secret blank, and enter the token when prompted.

Common questions

Is Charlotte a drop-in replacement for Playwright MCP?

Not exactly. Charlotte uses different tool names and a different response format. But the core workflow is the same: navigate to a URL, observe the page, interact with elements. Most agents adapt to Charlotte's tools naturally since MCP clients discover capabilities at connection time. The main functional gaps are file upload, multi-browser support, and coordinate-based vision tools.

How much does Charlotte actually save on tokens?

On navigation, Charlotte returns ~10–140x fewer characters than Playwright MCP depending on page complexity. For a 100-page browsing session on Claude Sonnet 5, that's $0.03 vs $3.82 in input token costs. Content-heavy pages like Hacker News see the largest gains (up to 139x smaller). Simple pages like example.com show modest improvement (1.1x). Real-world pages consistently fall in the ~10–140x range.

Can I use Charlotte with Claude, GPT-4, or other LLMs?

Yes. Charlotte implements the standard Model Context Protocol. Any MCP-compatible client works: Claude Desktop, Claude Code, Cursor, Windsurf, Cline, or custom MCP clients. The server communicates over stdio and doesn't depend on any specific LLM provider.

What makes this different from other browser MCP servers?

Charlotte was purpose-built for token efficiency. The demand-driven detail model, stable hash-based element IDs, structural diffing, semantic find, and tiered tool profiles are all designed to minimize the tokens agents spend on browsing. Most browser MCP servers, including Playwright MCP, send the full page state on every call regardless of what the agent needs.