ИИ Инструменты разработчика
Persona
Библиотека Agent UI с открытым исходным кодом на VanillaJS для создания агентных интерфейсов с WebMCP, SSE-стримингом и настраиваемой темой.
Persona
Что такое Persona?
Persona — это легковесная JavaScript-библиотека с открытым исходным кодом для создания агентных пользовательских интерфейсов (чат-интерфейсов) для AI-агентов. Она поддерживает плавающие, прикрепленные или полноэкранные макеты, интегрируется с любым SSE-бэкендом и использует WebMCP для предоставления агентам инструментов страницы. Библиотека не зависит от фреймворков и включает изоляцию Shadow DOM, темы и подключаемые парсеры.
Persona — сравнение с аналогами
| Модель ценообразования | Бесплатно | Бесплатно | Индивидуальная цена | Бесплатно, Платно |
| Бесплатные кредиты | ||||
| Ключевые возможности |
|
|
|
|
| Плюсы |
|
|
|
|
| Минусы |
|
|
|
|
| Кому подходит |
|
|
|
|
Как использовать Persona?
- 1Установите через npm: npm install @runtypelabs/persona
- 2Импортируйте CSS: import '@runtypelabs/persona/widget.css'
- 3Импортируйте initAgentWidget: import { initAgentWidget } from '@runtypelabs/persona'
- 4Инициализируйте виджет с целевым элементом и конфигом (URL API):
- 5initAgentWidget({ target: '#chat', config: { apiUrl: 'https://your-api.com/chat' } })
- 6Настройте тип запуска (floating, docked, fullscreen) через опцию config.
Persona Ключевые возможности
- Встроенная поддержка WebMCP: агенты могут использовать инструменты, зарегистрированные на странице через document.modelContext
- Рендеринг в Shadow DOM для изоляции стилей
- SSE-стриминг с подключаемыми парсерами и customFetch
- Трехуровневая система тем (палитра, семантика, компоненты) с темной темой и редактором в реальном времени
- Плавающий, прикрепленный или полноэкранный режимы UX
- Подключаемые адаптеры транспорта и парсеров
Persona Сценарии использования
- Виджет поддержки клиентов
- AI-помощник для существующих веб-приложений
- Ассистент онбординга для новых пользователей
- Агент для вопросов по документации
- Помощник электронной коммерции для поиска товаров и бронирования
Persona Цены и бесплатный доступ
Модель оплаты Persona: Бесплатно.
Persona Плюсы и минусы
Плюсы
- Легковесная и не зависит от фреймворков (чистый VanillaJS)
- Стандарт WebMCP позволяет агентам использовать существующие инструменты страницы
- Shadow DOM изолирует стили от хост-приложения
- Подключаемые транспорт и парсеры работают с любым SSE-бэкендом
- Комплексная система тем для настройки бренда
Минусы
- Документация и примеры ещё расширяются
- Требуется SSE-эндпоинт для полной функциональности
Для чего лучше всего подходит Persona?
- Разработчикам, создающим пользовательские AI-интерфейсы агентов
- Командам, желающим интегрировать агентный чат в существующие веб-приложения
- Проектам, которым нужен легковесный расширяемый чат-виджет