# MoonshotAI/kimi-code Vis App Features: A Complete Guide to the Visual Debugging Tool

> Explore the MoonshotAI/kimi-code vis app features. Inspect session metadata, wire timelines, agent hierarchies, task execution, and performance metrics with this visual debugging tool.

- Repository: [Moonshot AI/kimi-code](https://github.com/MoonshotAI/kimi-code)
- Tags: how-to-guide
- Published: 2026-08-14

---

**The vis app is a visual debugging dashboard for Kimi Code sessions, exposing REST endpoints and a web UI to inspect session metadata, wire timelines, agent hierarchies, task execution, and performance metrics.**

The **vis** application in the MoonshotAI/kimi-code repository provides developers with an interactive interface for deep inspection of AI agent sessions. Running as a lightweight web stack—`apps/vis/web` for the frontend and `apps/vis/server` for the HTTP backend—it transforms raw session data into structured, queryable views. This guide covers every feature, endpoint, and source file that makes up the vis debugging toolkit.

---

## Core Session Management Features

### Session List and Detail Views

The vis app surfaces stored sessions through two primary endpoints defined in [`apps/vis/web/src/api.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/api.ts):

- **List all sessions**: `GET /api/sessions` returns basic metadata for every stored session.
- **Single session detail**: `GET /api/sessions/:id` exposes health status, active agents, and configuration parameters.

These endpoints power the session browser UI, enabling developers to quickly locate and drill into specific runs.

### Wire Timeline Inspection

The **wire view** (`GET /api/sessions/:id/wire`) returns raw "wire" entries produced by the agent core—the foundational log stream that records every LLM turn, tool invocation, and intermediate step.

In [`apps/vis/web/src/lib/analysis.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/lib/analysis.ts), the `analyzeWire()` function transforms this flat timeline into a structured hierarchy:

```

turn → step → tool-call

```

This analysis computes critical metrics:
- **Duration**: Wall-clock time per turn and step
- **Token usage**: Input/output totals across the session
- **Cache hit rate**: Efficiency of the LLM context cache
- **Idle gaps**: Periods of inactivity between operations
- **Tool-call statistics**: Latency distributions and frequency

---

## Agent and Task Visualization Features

### Sub-Agent Hierarchy

The **sub-agent tree** endpoint (`GET /api/sessions/:id/subagents`) exposes the complete hierarchy of agents spawned during a session. Implemented in [`apps/vis/server/src/routes/subagents.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/subagents.ts), this feature maps parent-child relationships and delegation chains.

### Background Task Monitoring

Two endpoints track asynchronous work:

| Endpoint | Purpose | Implementation |
|----------|---------|----------------|
| `GET /api/sessions/:id/tasks` | Lists long-running tool calls and background operations | [`apps/vis/web/src/api.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/api.ts) (API contract) |
| `GET /api/sessions/:id/cron` | Displays scheduled cron-type tasks attached to the session | [`apps/vis/server/src/routes/cron.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/cron.ts) |

---

## Data Import, Export, and Binary Asset Access

### Session Import

The `POST /api/sessions/:id/import` endpoint in [`apps/vis/server/src/routes/imports.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/imports.ts) accepts ZIP files containing session data. This enables reproducible debugging by allowing teams to share and re-import complete session archives.

### Binary Blob Retrieval

Files, images, and other binary assets stored during a session are accessible via `GET /api/blobs/:id`, defined in [`apps/vis/server/src/routes/blobs.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/blobs.ts). The blob store operates independently of session metadata, with IDs cross-referenced in wire entries.

---

## Context Projection and Log Streaming

### Agent-Specific Context Views

The **context projection** endpoint (`GET /api/sessions/:id/context?agent=<agentId>`) returns the precise message window, token allocation, and configuration visible to a specific agent at query time. The DTO type in [`apps/vis/web/src/types.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/types.ts) mirrors the server response, ensuring type-safe client consumption.

### Real-Time Log Streaming

Log lines generated by a session are available through `GET /api/sessions/:id/logs` ([`apps/vis/server/src/routes/logs.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/logs.ts)). For live sessions, the UI can upgrade to WebSocket updates via `/api/v1/ws`, registered in [`apps/vis/server/src/app.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/app.ts).

---

## Code Examples: Working with Vis APIs

### Fetching Session Summaries

```typescript
import { fetchSessionSummaries } from '#/apps/vis/web/src/api';

async function listSessions() {
  const sessions = await fetchSessionSummaries();   // → SessionSummary[]
  console.table(sessions);
}
listSessions();

```

Source: [`apps/vis/web/src/api.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/api.ts)

### Retrieving Raw Wire Data

```typescript
import { fetchWire } from '#/apps/vis/web/src/api';

async function getWire(sessionId: string) {
  const { entries } = await fetchWire(sessionId); // WireEntry[]
  console.log(`Wire contains ${entries.length} records`);
}

```

### Running Timeline Analysis

```typescript
import { analyzeWire } from '#/apps/vis/web/src/lib/analysis';
import type { WireEntry } from '#/apps/vis/web/src/types';

async function analyse(sessionId: string) {
  const { entries } = await fetchWire(sessionId);
  const analysis = analyzeWire(entries as WireEntry[]);
  console.log('Turns:', analysis.turns.length);
  console.log('Total tokens:', analysis.summary.totalTokens);
  console.log('Avg. tool latency (ms):', analysis.toolStats[0]?.avgMs);
}

```

Core logic: [`apps/vis/web/src/lib/analysis.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/lib/analysis.ts)

### Querying Agent Context

```typescript
import { fetchContext } from '#/apps/vis/web/src/api';

async function showContext(sessionId: string, agentId: string) {
  const ctx = await fetchContext(sessionId, agentId);
  console.log('Projected messages:', ctx.messages.length);
  console.log('Current token window:', ctx.contextTokens);
}

```

Type definition: [`apps/vis/web/src/types.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/types.ts)

---

## Key Source Files Architecture

| File | Role |
|------|------|
| [`apps/vis/web/src/api.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/api.ts) | Client-side REST wrapper for all server endpoints |
| [`apps/vis/web/src/lib/analysis.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/lib/analysis.ts) | Timeline structuring and metrics computation |
| [`apps/vis/web/src/types.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/types.ts) | TypeScript DTOs mirroring server contracts |
| [`apps/vis/server/src/app.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/app.ts) | Server bootstrap, route registration, WebSocket setup |
| [`apps/vis/server/src/routes/subagents.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/subagents.ts) | Hierarchical agent tree endpoint |
| [`apps/vis/server/src/routes/logs.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/logs.ts) | Log streaming handler |
| [`apps/vis/server/src/routes/cron.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/cron.ts) | Scheduled task inspection |
| [`apps/vis/server/src/routes/imports.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/imports.ts) | Session ZIP import handler |
| [`apps/vis/server/src/routes/blobs.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/blobs.ts) | Binary asset retrieval |
| `apps/vis/web/src/hooks/*.ts` | React-style data fetching hooks (e.g., [`useSession.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/useSession.ts), [`useWire.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/useWire.ts)) |

---

## Summary

- **Session inspection**: List, detail, and wire views expose complete runtime state through [`apps/vis/web/src/api.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/api.ts)
- **Performance analytics**: The `analyzeWire()` function in [`apps/vis/web/src/lib/analysis.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/lib/analysis.ts) derives structured timelines and computes token, latency, and cache metrics
- **Agent hierarchy**: Sub-agent trees and context projections reveal how work is delegated across agents
- **Operational visibility**: Tasks, cron jobs, logs, and blob storage cover all auxiliary session data
- **Live and replay modes**: WebSocket support in [`apps/vis/server/src/app.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/app.ts) enables real-time monitoring, while import/export ensures reproducibility

---

## Frequently Asked Questions

### How does the vis app handle real-time session updates?

The vis server exposes a WebSocket endpoint at `/api/v1/ws` (registered in [`apps/vis/server/src/app.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/app.ts)) that pushes live updates to connected clients. The UI uses this to refresh session state, wire entries, and logs without polling while a session is actively running.

### What format does session import accept?

The import endpoint (`POST /api/sessions/:id/import` in [`apps/vis/server/src/routes/imports.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/server/src/routes/imports.ts)) accepts ZIP archives containing serialized session data. This format preserves wire entries, blob references, and agent configurations for complete session restoration.

### Can I query context for a specific agent within a session?

Yes. The `GET /api/sessions/:id/context?agent=<agentId>` endpoint returns the projected message window, token count, and configuration for any agent in the session. The TypeScript types in [`apps/vis/web/src/types.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/types.ts) define the response structure for type-safe client development.

### Where is the core analysis logic for timeline metrics?

The `analyzeWire()` function in [`apps/vis/web/src/lib/analysis.ts`](https://github.com/MoonshotAI/kimi-code/blob/main/apps/vis/web/src/lib/analysis.ts) implements the complete transformation from raw wire entries to structured turns, steps, and tool calls. It also computes derived metrics including durations, token usage, cache hit rates, and tool-call statistics.