modem-dev/sideshow

What it solves

Terminal-based coding agents typically communicate via a "wall of text," making it difficult to visualize complex architecture, UI sketches, or code diffs. Sideshow provides a live visual surface (a browser-based viewer) that allows agents to publish visual content alongside their text-based conversation, reducing the cognitive load on the user and saving output tokens by sending data rather than full HTML documents.

How it works

Sideshow runs as a Node.js server (or on Cloudflare Workers) that hosts a viewer. Coding agents—such as Claude Code, Codex, or Pi—are given a setup block that allows them to publish "surfaces" via an API. These surfaces are composed of various "parts" (e.g., Mermaid diagrams, Markdown, HTML fragments, JSON trees, and syntax-highlighted diffs) which the viewer then renders live in the browser using a pre-defined theme.

Who it’s for

Developers using terminal-based AI coding agents who want a multimodal way to review the agent's proposed changes, architecture diagrams, and execution traces without leaving their workflow.

Highlights

• Multimodal Rendering: Supports a wide variety of visual parts including Mermaid flowcharts, syntax-highlighted diffs, terminal output with ANSI color, and collapsible JSON trees.
• Token Efficiency: Reduces LLM output tokens by sending structured data (like Mermaid source) instead of full HTML/CSS, resulting in faster draws and lower costs.
• Agent Agnostic: Works with any agent harness that has shell access, including Claude Code, Codex, and Opencode.
• Flexible Deployment: Can be run locally via Node.js or deployed to Cloudflare Workers for remote access.
• Interactive Elements: HTML surfaces can include buttons that call sendPrompt() to post feedback directly back to the agent's thread.