CopilotKit відкриває Open Generative UI: реалізація крос-агентської фреймворк-архітектури для Claude Artifacts

Відкритий AI Agent фронтенд-фреймворк CopilotKit 7 травня оголосив про запуск Open Generative UI — відкриту реалізацію функції Anthropic Claude Artifacts. @akshay_pachaar зібрав і пояснив деталі: версії CopilotKit дозволяють агенту під час виконання динамічно генерувати HTML/SVG, які відображаються в sandboxed iframe у режимі token-by-token стріму. Користувач може одразу бачити процес складання інтерфейсу, не очікуючи повної відповіді. До Claude Artifacts можливості генеративного UI існували лише в продуктах Anthropic; CopilotKit відкрив такий самий підхід для зовнішнього використання і його можна інтегрувати в будь-який застосунок.

Ключовий механізм: агент генерує HTML/SVG у реальному часі та стрімить у sandboxed iframe

Технічний дизайн Open Generative UI:

Агент не обирає з наперед підготовлених компонентів, а кожного разу з нуля генерує будь-який візуальний контент

Вивід у форматі HTML/SVG token-by-token стрімиться в інкапсульований iframe

iframe повністю ізольований: не може отримати доступ до батьківського застосунку, DOM чи даних користувача

Навіть якщо агент створює некоректні теги або несподіваний JavaScript, цього не витікає за межі iframe

Розробники можуть через «skill prompts» підказувати агенту згенерувати певний візуальний формат (наприклад, Chart.js dashboard із підписами осей координат, або 3D-модель із керуванням обертанням тощо)

Sandbox-дизайн — це стандартний підхід до ризику «Agent довільно генерує код»: агент може вільно створювати контент, але з обмеженням області виконання, щоб не порушувати безпеку головного застосунку.

Сумісний діапазон: LangGraph/CrewAI/Mastra/Google ADK/AWS Strands

Open Generative UI побудований на AG-UI протоколі та з коробки сумісний із кількома Agent фреймворками:

LangGraph

CrewAI

Mastra

Google ADK

AWS Strands

Також надається окремий MCP (Model Context Protocol) сервер, який можна підключати для використання клієнтами: Claude Code, Cursor або будь-яким сумісним MCP-клієнтом. Уся система побудована на відкритому фронтенд-фреймворку CopilotKit: на GitHub у CopilotKit уже понад 30 000 зірок, а також є SDK для React, Next.js, Angular і Vue.

Значення для розробників AI Agent: GenUI стандарт, що працює між фреймворками та моделями

Ця публікація важлива для рівня застосунків для AI Agent:

Раніше розробникам, щоб додати в свій app «динамічний UI у стилі Claude Artifacts», доводилося все реалізовувати з нуля

Open Generative UI дає відкритий варіант, який працює між фреймворками й між моделями

Через MCP сервер, Claude Code та Cursor користувачі можуть підключатися напряму

Подальші події, які можна відстежити: рівень використання CopilotKit Open Generative UI в спільнотах LangChain/CrewAI, офіційна реакція Anthropic на те, що «Claude Artifacts реалізували у відкритому доступі», а також чи інші Agent фреймворки пропонують подібні можливості GenUI.

Ця стаття CopilotKit відкриває Open Generative UI: реалізацію Claude Artifacts у крос-агентному фреймворку вперше з’явилася на ABMedia в стрічці новин.