Context Viewer

Observability for AI contexts. Context Viewer turns conversation logs, agent transcripts, API traces, and long prompts into token-level, component-level breakdowns: what is in the context window, how much space each part consumes, and how those parts change across runs.

Try it in the hosted browser app at https://nilenso.github.io/context-viewer/, or use the analyzer pipeline in your own tooling.

Install the agent CLI

The agent-facing CLI is published as @nilenso/context-lens:

npm install -g @nilenso/context-lens

It is meant to be driven by an AI coding agent, not hand-operated. Once it is installed, ask your agent to analyze a transcript with a prompt like:

Use `context-lens` cli and analyze the sessions in agent-session.jsonl.

The agent should choose the analysis dimensions and components based on the question, run context-lens, and return a concise interpretation plus a Context Viewer link when sharing is useful.

Research and recognition

• Paper/technical report: Context Viewer on alphaXiv
• Received an Industry Spotlight Award at ACM CAIS 2026
• Featured at AI Engineer World's Fair (AIE WF) 2026

Screenshots

Component waffle comparison	Prompt swapping on SWE-bench

Open the poster PDF.

Project architecture

Both the browser viewer and the CLI are built on top of the same analyzer pipeline:

        +--------------------+        +--------------------+
        |   Context Viewer   |        |  context-lens CLI  |
        |   browser UI       |        |  agent / terminal  |
        +----------+---------+        +----------+---------+
                   |                             |
                   +-------------+---------------+
                                 |
                                 v
                    +------------+-------------+
                    |        analyzer          |
                    | parse -> tokenise ->     |
                    | segment -> classify ->   |
                    | analytics + exports      |
                    +--------------------------+

Given a conversation transcript, the analyzer pipeline:

1. Parses the input and normalizes it to a standard message schema
2. Counts tokens using tiktoken with GPT-4o encoding
3. Segments large text parts into semantic chunks with AI
4. Identifies components or applies the dimensions/components you provide
5. Classifies every message part into components, batched and in parallel
6. Colors components and returns waffle-chart-ready analytics plus the full annotated conversation

Supported input formats

Format	File types
Claude Code transcripts	.jsonl
Codex CLI transcripts	.jsonl
OpenCode transcripts	.json
OpenAI Responses API	.json
OpenAI Completions API	.json
OpenAI Conversations API	.json
SWE-bench trajectories	.json, .traj
SWE-agent trajectories	.json
Context Viewer exports	.json
Plain text / markdown	.txt, .md

Sample analyses

Explore these pre-loaded comparisons to see what Context Viewer can do:

• Coding agent system prompts compared — Claude Code, Cursor, Gemini CLI, Codex CLI, OpenHands, and Kimi CLI side by side
• Claude Code prompt evolution — how Claude's system prompt has changed across model versions
• Codex CLI prompt evolution — Codex's system prompt changes over time
• Swapping prompts on SWE-bench — how different system prompts affect agent behavior on identical tasks
• Claude Code compaction analysis — pre vs post compaction breakdown of Claude Code sessions

The first four samples are from Drew Breunig's System Prompts Define the Agent as Much as the Model.

Run locally

# Install bun, if needed
curl -fsSL https://bun.sh/install | bash

# Install dependencies
bun install

# Copy .env.example to .env and add your API key
cp .env.example .env
# Edit .env and set VITE_AI_API_KEY=your-api-key-here

# Start the development server
bun run dev

# Run tests
bun run test

Environment configuration

The application supports automatic semantic segmentation of large message parts using AI. This feature is optional but recommended for better analysis of large conversations.

Create a .env file based on .env.example:

# AI API Configuration for Semantic Segmentation
VITE_AI_API_KEY=your-openai-api-key
VITE_AI_MODEL=gpt-4o-mini  # Optional, defaults to gpt-4o-mini

Documentation

• System overview — data model, processing pipeline, visualizations, and interactive workflow
• Workflow — multi-stage pipeline from conversation log to visual insights
• Capabilities — what Context Viewer can do
• Categorisation — how conversation content is organized into semantic categories
• Segmentation — splitting message parts into self-contained semantic units
• Tech stack — TypeScript/React stack, build tools, and libraries
• Long prompts analysis — patterns and evolution of system prompts across CLI tools

Privacy and design

Conversation data is private. Your data should stay with you. Context Viewer has no backend component: the browser app processes files locally, and the CLI writes local exports. AI-based segmentation and classification are sent only to the model provider you configure.

Input conversations should support many formats because this space is still evolving. Parsers are implemented behind a shared interface so it is easy to add another agent or API format.

License

This project is licensed under the MIT License - see the LICENSE file for details.