Token-Optimized DOM Export
Phase 3 — Compressed semantic JSON snapshot of the page for LLM context windows, achieving over 50% token reduction compared to the standard accessibility tree. Every AI browser agent benefits from this — smaller snapshots mean faster decisions, lower cost, and more room in the context window for browser automation instructions.
The Problem
A typical accessibility tree for a modern web page consumes 5,000-20,000 tokens. Most of those tokens are structural noise: wrapper divs, generic groups, section containers, paragraph wrappers, and redundant whitespace. The AI agent needs semantic content, not DOM bureaucracy.
Output Format
The optimized DOM uses an array-of-tuples format where each node is [depth, roleCode, name, props?]:
{
"v": 1,
"title": "Hacker News",
"url": "https://news.ycombinator.com",
"nodes": [
[0, "doc", "Hacker News"],
[1, "nav", "Navigation"],
[2, "lnk", "new", {"href": "/newest"}],
[2, "lnk", "comments", {"href": "/newcomments"}],
[1, "lst", ""],
[2, "li", "Show HN: VulpineOS"],
[2, "li", "Ask HN: Best AI agent frameworks?"]
]
}Compression Strategies
| Strategy | Example | Savings |
|---|---|---|
| Short role codes | heading → h2, button → btn, link → lnk | ~30% on role strings |
| Skip structural wrappers | section, group, paragraph removed | ~20% node reduction |
| Single-child flattening | Parent with one child → merge into parent | ~10% node reduction |
| Adjacent text merging | Three text nodes → one combined string | ~5% token reduction |
| Omit empty/default fields | No props key if empty | ~5% overhead reduction |
Role Code Map
Over 50 roles are mapped to short codes:
| Role | Code | Role | Code |
|---|---|---|---|
| document | doc | heading (level N) | hN |
| button | btn | link | lnk |
| textbox | txt | checkbox | chk |
| radio | rad | combobox | cmb |
| listitem | li | navigation | nav |
| table | tbl | row | row |
| cell | cel | image | img |
Protocol
{
"method": "Page.getOptimizedDOM",
"params": {
"maxDepth": 10,
"maxNodes": 500,
"maxTextLength": 200
}
}All parameters are optional — sensible defaults are applied.
Configuration
vulpineos.dom_export.enabled = true // defaultFiles Modified
additions/juggler/content/PageAgent.js—ROLE_MAP,SKIP_ROLES,_getOptimizedDOM()methodadditions/juggler/protocol/Protocol.js—Page.getOptimizedDOMdefinitionadditions/juggler/protocol/PageHandler.js— handler routingsettings/camoufox.cfg—vulpineos.dom_export.enabledpreference
See also
- Token Optimization — viewport pruning, caching, incremental snapshots
- Injection-Proof Filter — strip hidden DOM nodes to prevent prompt injection
- Action Lock — freeze pages during AI agent thinking
- MCP Browser Tools — 36 tools for AI agent browser control