Знакомо чувство, когда ваш прекрасный локальный LLM на Ollama или llama.cpp выдает гениальный ответ, но в виде скучного JSON? А потом вы часами пишете парсеры, пытаясь понять, что вообще происходит в этом потоке токенов? У меня тоже.
Brain-canvas — это плевок в лицо текстовому интерфейсу. Инструмент, который за пять минут превращает ваши JSON-ответы от LLM в интерактивные визуализации. Без установки Python, без npm install, без танцев с бубном.
Запустить проще, чем объяснить
Серьезно, вот вся инструкция:
1Установите Node.js (если его нет)
Да, это единственная зависимость. Если у вас уже есть Node.js 14+, пропускайте этот шаг. Если нет — скачайте с официального сайта. Не надо писать мне, что «я питонист, ненавижу JavaScript». Я тоже питонист. Но иногда нужно просто запустить команду и забыть.
2Запустите brain-canvas
npx brain-canvasВсё. Серьезно, всё. Утилита скачается, запустится локальный веб-сервер на порту 3000, откроется браузер с интерфейсом.
Не хотите автоматического открытия браузера? Используйте флаг --no-open. Хотите другой порт? --port 8080. Вся магия — в одной команде.
3Настройте вашу LLM
Brain-canvas работает с любой LLM, которая умеет выдавать JSON. Ollama? Легко. llama.cpp? Тоже. Собственный сервер на FastAPI? Да хоть на COBOL.
Что мозг может показать на холсте
Интерфейс brain-canvas — это не просто «красивые картинки». Это инструмент для отладки, анализа и просто любопытства.
| Что визуализируется | Зачем это нужно |
|---|---|
| Дерево рассуждений (chain-of-thought) | Видеть, как модель приходит к выводу. Где она тупит, где делает скачки логики. |
| Взвешенные варианты ответов | Когда модель предлагает несколько вариантов с вероятностями — визуально сравнить их. |
| Структурированные данные | JSON с категориями, тегами, связями превращается в интерактивную карту. |
| Прогресс генерации | В реальном времени следить, как модель «пишет» ответ. |
Пример: вы просите LLM распланировать день. В ответ получаете JSON с задачами, приоритетами, зависимостями. Brain-canvas рисует это как диаграмму Ганта. С возможностью перетаскивать, скрывать, выделять.
Важно: brain-canvas не заменяет серьезные инструменты анализа вроде визуализации скрытых состояний. Это быстрый «костыль» для ежедневного использования.
С чем его едят: интеграция с реальными проектами
Допустим, у вас уже есть проект с локальной LLM. Что делать? Всего три варианта.
Вариант 1: Прокси через brain-canvas
Настраиваете вашу LLM отправлять ответы на локальный сервер brain-canvas. Он принимает JSON, визуализирует, возвращает вам ссылку на просмотр. Работает даже если ваша LLM запущена в Docker.
Вариант 2: Экспорт в файл
Сохраняете вывод LLM в JSON-файл, перетаскиваете его в интерфейс brain-canvas. Подходит для анализа уже сгенерированных ответов — например, когда тестируете разные промпты из коллекции промптов.
Вариант 3: Встроенный виджет
Самый интересный вариант. Brain-canvas предоставляет JavaScript-библиотеку, которую можно встроить в ваш веб-интерфейс. Получили ответ от LLM — отобразили его как интерактивный график прямо на вашей странице.
Это особенно удобно для проектов вроде мультимодальных краулеров — тех, о которых мы писали в статье про построение краулера с нуля.
А что там под капотом? (Спойлер: ничего сложного)
Brain-canvas — это не нейросеть. Это не машинное обучение. Это просто умный рендерер JSON на HTML Canvas.
Технически:
- Локальный сервер на Express.js
- Фронтенд на чистом JavaScript + Canvas API
- Поддержка WebSocket для реального времени
- Ноль зависимостей в рантайме (все в одном пакете)
Автор сделал инструмент максимально тупым и предсказуемым. И это его главное достоинство. Не нужно разбираться в архитектуре, не нужно настраивать конфиги. Запустил — работает.
Кому это реально нужно? (Не всем)
Правда в том, что большинству пользователей хватает текстового вывода. Но есть три категории людей, которым brain-canvas спасет жизнь.
Разработчики, которые тестируют свои промпты
Когда вы создаете сложные цепочки промптов для тестирования логики LLM, визуализация дерева рассуждений показывает, где модель сбивается с пути. Текст этого не покажет.
Исследователи, которые сравнивают модели
Вместо того чтобы скроллить тонны JSON-ответов от разных LLM, вы видите их бок о бок на одном холсте. Особенно полезно вместе с инструментами для сравнения графиков.
Преподаватели и демонстраторы
Показать студентам, как работает цепочка рассуждений в LLM, на живом примере. Без необходимости устанавливать тяжелые IDE или писать код.
Альтернативы? Есть. Но...
Конечно, можно написать свой визуализатор на D3.js. Или использовать Grafana с плагинами. Или даже запускать LLM прямо в браузере и там же визуализировать.
Но brain-canvas выигрывает в одном: времени от идеи до результата. Пять минут против пяти часов. Бесплатно против «нужно купить лицензию». Ноль зависимостей против «установите эти 15 пакетов».
Это инструмент для ленивых. Или для тех, у кого нет времени. Или для тех, кто просто хочет посмотреть, что творится в голове у его LLM, без лишних телодвижений.
Самый большой недостаток brain-canvas? Он не умеет «умную» визуализацию. Если ваш JSON кривой — получите кривой график. Инструмент не пытается угадать, что вы имели в виду. Он просто рисует то, что вы дали.
Что дальше? (Совет от инсайдера)
После того как вы поиграетесь с brain-canvas, попробуйте подключить его к реальному проекту. Например, к Brain Pocket — минималистичному способу запуска ИИ.
Или создайте свой собственный формат JSON для визуализации. Brain-canvas поддерживает плагины (пока экспериментально). Можно научить его рисовать специфичные для вашей задачи диаграммы.
Мой прогноз: через год такие инструменты станут стандартом для отладки LLM. Потому что текстовые логи — это как пытаться понять симфонию, читая ноты. А визуализация — это услышать ее.
Запустите npx brain-canvas прямо сейчас. Даже если вам не нужно. Просто чтобы посмотреть, как выглядит мысль вашей LLM. Это занимает пять минут. А впечатлений — на неделю.
