explaingit

modaic-ai/gepa-viz

27TypeScriptAudience · developerComplexity · 3/5Setup · moderate

TLDR

gepa-viz is a browser-based live visualization tool that draws an interactive graph of AI prompt optimization runs, showing which prompt candidates were accepted or rejected and why, as the optimizer runs.

Mindmap

mindmap
  root((gepa-viz))
    What it does
      Live prompt graph
      Accepted nodes
      Rejected nodes
      Performance rings
    How it works
      Python callback
      JSON data file
      Browser renderer
    Tech Stack
      Python package
      React frontend
      D3 visualization
      Tailwind CSS
    Audience
      Developers
      AI researchers
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Visualize a GEPA or DSPy prompt optimization run as an interactive node graph that updates live in your browser.

USE CASE 2

Click on rejected prompt nodes to read the feedback that caused each candidate to be discarded.

USE CASE 3

Compare prompt performance across test examples using the color-coded donut rings displayed on each graph node.

USE CASE 4

Modify the visualization front end by running the live-reload dev server without touching the Python package.

Tech stack

PythonReactD3TailwindTypeScript

Getting it running

Difficulty · moderate Time to first run · 30min

Requires an existing GEPA or DSPy optimization script to generate the run data that feeds the visualization.

No license information is mentioned in the explanation.

In plain English

gepa-viz is a live visualization tool for watching AI prompt optimization runs in your browser. It connects to GEPA, a prompt optimization library, and draws an interactive graph that updates in real time as the optimizer explores and tests different prompt candidates. The idea is to give you a visual window into a process that would otherwise be an opaque stream of terminal output. The graph works like a family tree of prompts. Each prompt the optimizer accepts appears as a donut-shaped node, and the colored ring around it shows how well that prompt performed on individual test examples (green for correct, red for wrong). Rejected prompt attempts show up as small grey nodes. Hovering over a grey node reveals the feedback that caused it to be discarded. Clicking any node opens a detail panel with the full prompt text, a diff showing what changed from the parent prompt, and a breakdown of how the optimizer evaluated it. Installation is a single pip command. Once installed, you add one callback object to your existing GEPA or DSPy optimization script, then run a separate terminal command to start a local web server. A browser tab opens automatically and the graph grows node by node as the run progresses. There is no Node.js or other runtime required to serve it. Under the hood the project is split into a Python package that captures the run data and writes it to a JSON file, and a browser front end built with React, D3, and Tailwind that reads and renders that file. The pre-built browser app is bundled inside the Python wheel, so end users never need to touch the front-end code. Developers who want to modify the visualization can run a live-reload dev server with a few provided commands.

Copy-paste prompts

Prompt 1
I have a GEPA prompt optimization script in Python. Show me the exact code to add the gepa-viz callback and start the local visualization server so I can watch it in my browser.
Prompt 2
How do I install gepa-viz with pip and connect it to an existing DSPy optimization run? What is the minimum code change required?
Prompt 3
Walk me through reading the gepa-viz graph: what do the donut-ring colors on each node mean, and how do I find the best-performing prompt candidate?
Prompt 4
I want to customize the gepa-viz graph layout. How do I run the React front-end dev server and make changes to the D3 visualization code?
Open on GitHub → Explain another repo

← modaic-ai on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.