Your agent should understand what you see

Summary

Sentry's Seer Agent initially parsed user screens using DOM-scraped character-by-character ASCII grids, leading to severe token consumption, model context rot, and an inability to support interactive actions. To resolve these bottlenecks, Sentry replaced visual text scraping with a composable semantic context system where React UI components directly declare their state, metadata, and interactive affordances. A root React context provider maintains a registry of component nodes organized hierarchically through higher-order wrappers, serializing the resulting structure to JSON and backend-generated Markdown within the system prompt. Across twenty-four live pages, this approach reduced dashboard context tokens from roughly 5,500 to 1,300 while maintaining identical satisfaction rates and tool-call volumes across more than 14,000 evaluated conversations.

Context

Sentry's Seer Agent originally gathered page context by scraping the DOM into an ASCII character grid. Single dashboards reached p95 token measurements of 50,000 tokens or more, consuming 85-93% of the system prompt on average. This high volume caused context rot in Claude Sonnet models, degraded multi-turn conversation quality, and provided no structured way to express interactive elements or execute UI actions.

Approach / What changed

Sentry implemented a bottom-up semantic context system using React. A root context provider maintains a flat registry of nodes, populated when components mount via a higher-order component wrapper. Components supply their own state, modes, and filters through hooks, deriving hierarchy directly from the React component tree. The registry is assembled into a nested tree, serialized to JSON, and converted to Markdown on the backend for inclusion in the system prompt.

Takeaways

• Switching from ASCII snapshots to semantic context dropped page context prompt usage from 85–93% down to 50–80%, reducing dashboard tokens from ~5,500 to ~1,300 and issue detail tokens from ~2,100 to ~300.
• Across over 14,000 conversation runs evaluated by an LLM as a judge, the structured context approach matched the prior ASCII snapshot approach in both user satisfaction rates and average tool calls per conversation.
• The composable architecture derives component hierarchy automatically from React's component tree, allowing unmigrated UI components to fall back seamlessly to ASCII snapshots.

Related reading

• Sentry · May 28, 2026

  How we cut build times by two-thirds by deleting our CMS

  Sentry rebuilt its marketing site and blog of roughly 2,500 pages, replacing a legacy Gatsby setup and traditional headless CMS with Astro, Markdown, Frontmatter, and AI-driven automation. The previous architecture suffered from 14-minute build times, restrictive CMS schema limits, and frequent build failures caused by external API dependencies. A team of 2.5 developers executed the migration in two months using Claude Code agents for data extraction, template translation, and testing. To manage content without a CMS dashboard, Sentry built Claude Skills to guide updates, run local previews, and draft GitHub pull requests. The migration reduced average build times to under 4 minutes, cut broken staging builds by 95 percent, and improved Web Vitals scores from 89 to 97.

  Eli Lennox

• Sentry · May 26, 2026

  Your agent can't fix what it can't see