Trace.

Agent run timeline

Show the work, not a spinner.

Reasoning streams in and folds away, tool calls show their input and output, parallel calls run side by side, and failures offer a retry. Adapters read OpenAI, Anthropic and AI SDK streams directly.

Use it

<link rel="stylesheet" href="trace.css">
<div id="trace" style="height: 360px"></div>

<script type="module">
  import Trace from './trace.js';

  const trace = new Trace(document.querySelector('#trace'));

  // From a model stream: 'openai', 'anthropic' or 'ai-sdk'
  await trace.fromEvents(stream, { format: 'anthropic', runTool: (name, args) => tools[name](args) });

  // …or step by step
  const call = trace.tool('analytics.summary', { args: { days: 30 } });
  call.done({ result: { reach: 7200 } });
  trace.finish('Post scheduled');
</script>