Хватит читать логи LangChain: я написал визуальный open-source отладчик для ИИ-агентов
Если вы пробовали писать ИИ-агентов или цепочки (chains) на LangChain, то знаете главную боль разработки — отладку.
Когда агент состоит из промпта, вызова LLM, парсера и пары инструментов (tools), логи в консоли превращаются в нечитаемую стену текста. Понять, что именно пришло на вход конкретному узлу, почему модель выдала галлюцинацию или где сломался парсинг JSON — задача, требующая крепких нервов.
Мне надоело скроллить терминал, поэтому я написал Zengin AI Debugger — легковесный инструмент, который визуализирует работу LangChain в реальном времени.
Как это работает
Идея простая: перехватывать события LangChain прямо во время выполнения и по WebSockets отправлять их на фронтенд, где они отрисовываются в виде красивого графа.
Инструмент состоит из двух частей:
- Frontend-дашборд (React + ReactFlow): Рисует ноды, показывает инпуты и аутпуты каждого шага.
- Python-плагин: Слушает события из LangChain и отправляет их на дашборд.
Как интегрировать в свой проект?
Я постарался сделать интеграцию максимально ленивой. Не нужно переписывать архитектуру, всё делается в три простых шага.
Шаг 1. Ставим дашбордВ терминале пишем команду глобальной установки через npm: npm install -g zengin-ai-debugger.После этого просто вводим zengin-ai-debugger, и у вас в браузере откроется локальный сервер с интерфейсом.
Шаг 2. Ставим Python-плагин В терминале вашего проекта пишем: pip install zengin-ai-debugger.
Шаг 3. Добавляем в код (буквально две строчки)Вам не нужно менять логику работы агента. Вы просто импортируете наш класс RealUIDebuggerCallback и передаете его в конфигурацию (параметр config) при вызове вашей LangChain-цепочки.
Единственное важное правило: цепочку нужно вызывать асинхронно (через метод ainvoke), чтобы WebSockets могли пробрасывать данные в реальном времени.
Запускаем код — и в браузере сразу появляются блоки. Кликаем на любой шаг (например, на LLM) и видим точный промпт, который улетел в нейросеть, и точный ответ, который она вернула.
Под капотом
Стек максимально классический, чтобы проект было легко поддерживать:
- Бэкенд-мост: FastAPI + WebSockets (пробрасывает данные от агента во фронт).
- Фронтенд: React 19 + Vite + ReactFlow (для отрисовки графа).
- Связка с ИИ: Родные callbacks из библиотеки langchain-core.
Итог
Проект полностью открытый (LGPL-2.1) и бесплатный. Изначально делал тулзу для себя, чтобы ускорить разработку локальных ботов на Ollama, но решил завернуть в npm/pypi пакеты, так как аналогов (не считая тяжелых энтерпрайз-решений вроде LangSmith) не нашел.
Если вы тоже пишете под ИИ и страдаете от консольных логов — буду рад, если инструмент сэкономит вам время.
🔗 Исходники, документация и Chrome-расширение лежат на GitHub:
Буду благодарен за фидбек, баг-репорты и звездочки репозиторию. Если есть идеи, как улучшить флоу — добро пожаловать в PR!