- Displays all AI SDK generations, tool calls, and failures in real-time
- 100% open-sourced, takes 7 lines of code to set up, and runs fully locally
The goal is to help you understand what your agent is doing without having to leave your local dev environment. Would appreciate feedback from any Next.js devs willing to try this!
// Motivation + background:
Arman used to work at Mintlify, where he spent most of his time optimizing user-facing AI agents built on the AI SDK. Rohil worked on Gmail Intelligence at Google, reducing hallucinations in intent detection across 26B+ daily emails.
Optimizing AI agents is very fun, but debugging them & understanding exactly what they do is annoying lol. Both of us found it especially painful to scrub through logs and find “silent failures” (doom loops, bad tool calls, hallucinations, etc.).
This tool was made to solve that exact issue. Instead of adding `console.log()` everywhere or inspecting hundreds of “UIMessage” objects, we propose a local-first solution that displays all AI SDK generations locally. We care deeply about DX; it’s our single biggest priority.
// Video demo:
https://github.com/The-Context-Company/observatory/raw/main/...
// How this works under the hood:
You can see the full codebase here: https://github.com/The-Context-Company/observatory/
At its core, this is essentially a light-weight sync engine:
- On the server, we initialize a WebSocket server and store AI SDK generations in memory. - On the browser, we render a lightweight Preact widget that opens a connection with the server to display new runs.
Diagram: https://github.com/The-Context-Company/observatory/blob/main...
We took a lot of inspiration from react-scan, especially when thinking about the DX we want to offer. We internally set these requirements:
- UI must display just the right information and make copying any value easy.
- The widget should not be too obtrusive - must be resizable, movable, and dockable.
- Minimal code changes. This means:
- Setting up the widget must be as easy as copying and pasting a single <script /> tag.
- Instrumentation should also be easy to set up and must work alongside other OTel configs (e.g. Sentry) and wrapped functions (e.g. Braintrust).
We plan on maintaining and improving the tool based on feedback from the Next.js and AI SDK communities by releasing new features and improving the UX.
Both of us are now working full-time on The Context Company, where we’re rethinking context engineering from the ground up, starting with agent observability. AI agents often fail quietly: picking the wrong tools, looping, hallucinating, and more. Our goal is to uncover these silent failures that standard monitoring misses.
// Links:
https://github.com/The-Context-Company/observatory
https://docs.thecontext.company/frameworks/ai-sdk/local
- Your friendly neighborhood devs, Arman and Rohil