ObservAgent Gives You Real-Time Claude Code Session Visibility

Install ObservAgent to see live cost tracking, tool latency, and subagent activity during your Claude Code sessions—no code changes needed.

1d ago·3 min read·5 views·via hn_claude_code
Share:

What It Does — Live Observability Without Wrappers

ObservAgent is a local dashboard that gives you real-time visibility into every Claude Code session. It solves the fundamental problem of running multi-agent workflows or long autonomous runs: you finish a session and have no idea what happened. Why did it cost $4? Which tool took 10 seconds? When did a subagent silently fail?

Claude Code writes JSONL transcripts, but they're post-mortem artifacts—not usable while your session is live. By the time you notice something's wrong, you've already burned through your budget.

Setup — Three Commands, No Configuration

ObservAgent works entirely via Claude Code's hooks system (PreToolUse, PostToolUse, SubagentStart, SubagentStop). It installs a tiny Python relay that fires fire-and-forget POST requests to a local Fastify server on every hook event. The server stores events in SQLite and streams them to a React dashboard over SSE.

Installation is straightforward:

npm install -g @darshannere/observagent
observagent init   # installs hooks into ~/.claude/settings.json
observagent start  # opens dashboard at localhost:4999

That's it. Run any Claude Code session and watch it live.

What You Get — Metrics That Matter

Real-Time Cost Tracking

ObservAgent shows per-model token usage with automatic cost calculation against current Claude pricing. This includes cache read/write operations. You can watch spending accumulate as your session runs and catch runaway costs before they land on your bill.

Tool Call Log with Latency

Every tool call appears with execution time, success/failure status, and arguments. The dashboard provides p50 and p95 latency breakdowns so you know exactly which tools are slow. No more guessing why a session took 30 seconds—you can see the specific bottleneck.

Agent Tree Visualization

See the parent-child agent hierarchy with per-agent cost rollups. The session timeline shows subagent tracking with filtering capabilities, letting you view independent tool activity side by side.

Session History and Replay

All sessions are grouped by repository with one-click replay and JSONL/CSV export functionality. The health panel aggregates metrics across sessions for trend analysis.

Architecture — Local-First, No Telemetry

Everything binds to 127.0.0.1. No cloud, no telemetry, no API keys needed. ObservAgent runs entirely on your machine and never sends data anywhere. The hooks architecture means it works without touching your code—no wrappers, no SDK changes.

When To Use It

  • Multi-agent workflows: Track which subagents are costing the most and identify silent failures
  • Long autonomous runs: Monitor progress and costs in real time instead of waiting for completion
  • Tool optimization: Identify slow tools that are bottlenecking your sessions
  • Budget management: Set up ObservAgent as a cost guardrail for expensive operations

ObservAgent is available on npm and requires Node.js 18 or later. The GitHub repository includes detailed documentation about the hooks architecture and how cost attribution works across subagents (which is apparently trickier than it sounds).

AI Analysis

Claude Code users should install ObservAgent immediately for any non-trivial development work. The biggest workflow change is moving from post-session analysis to real-time monitoring. Instead of waiting for a session to finish and then examining JSONL files, you can now watch costs accumulate and tool performance as it happens. Specific actions: 1) Run `npm install -g @darshannere/observagent` and set it up once. 2) Keep the dashboard open in a browser tab during complex Claude Code sessions. 3) Use the latency metrics to identify and optimize slow tools—this could mean switching from one file search method to another or batching operations. 4) Use the cost tracking to set mental budgets before starting sessions; if you see costs climbing faster than expected, you can interrupt and adjust your approach. The agent tree visualization is particularly valuable for understanding multi-agent workflows. Instead of guessing which subagent called what, you get a clear hierarchy. This makes debugging complex agent orchestrations significantly easier. Export the session data to CSV for deeper analysis of cost patterns across different types of tasks.
Original sourcedarshannere.github.io

Trending Now