Back to Hooks

Context Timeline

Hooks monitoring 1,137

Real-time browser visualization of Claude Code's context window and subagent/tool execution as a git-graph timeline. Opens http://localhost:7878 on SessionStart with a vertical timeline (most recent on top), one column per agent (main + subagents branching from their Task tool call). Tool calls are color-coded by type (Read=green, Edit/Write=orange, Bash=red, Grep/Glob=cyan, Task=purple, Web=yellow, MCP=gray). Right sidebar shows context-window usage (tokens/200K) with cache_read/cache_creation/input/output breakdown plus per-subagent mini-context. Reads ~/.claude/projects/<encoded-cwd>/<session_id>.jsonl directly — no data replication, no network calls. Pure stdlib Python, zero pip dependencies. Persistent daemon HTTP server on port 7878 (auto-fallback 7879-7888 if busy; override with CONTEXT_TIMELINE_PORT env var). Watchdog auto-shutdown after 1h of inactivity. Disable browser auto-open with CONTEXT_TIMELINE_NO_BROWSER=1. Manual shutdown: python3 .claude/hooks/context-timeline.py --shutdown

Install Command
npx claude-code-templates@latest --hook monitoring/context-timeline
View on GitHub
claude-code — context-timeline

Content

JSON
{
"description": "Real-time browser visualization of Claude Code's context window and subagent/too..."
"hooks": {
"SessionStart": [1 item]
"PreToolUse": [1 item]
"PostToolUse": [1 item]
"Stop": [1 item]
}
}

Stack Builder

0 components

Your stack is empty

Browse components and click the + button to add them to your stack for easy installation.