เฟรมเวิร์กส่วนหน้าสำหรับ AI Agent แบบโอเพนซอร์ส CopilotKit ประกาศเมื่อวันที่ 7 พฤษภาคมว่าเปิดตัว Open Generative UI ซึ่งเป็นการนำฟีเจอร์ของ Anthropic Claude Artifacts มาเปิดโอเพนซอร์สอย่างเป็นทางการ akshay_pachaar รวบรวมและอธิบายไว้ โดยเวอร์ชันของ CopilotKit ทำให้ Agent สามารถสร้าง HTML/SVG แบบไดนามิกขณะรัน และแสดงแบบสตรีมด้วยโทเคนต่อโทเคนใน sandboxed iframe ทำให้ผู้ใช้เห็นกระบวนการประกอบอินเทอร์เฟซได้ทันที ไม่จำเป็นต้องรอจนกว่าจะได้คำตอบครบทั้งชุด
ก่อนหน้า Claude Artifacts ของ Anthropic ความสามารถด้าน generative UI มีอยู่แค่ในผลิตภัณฑ์ของ Anthropic เองเท่านั้น; CopilotKit เปิดโมเดลลักษณะเดียวกันออกสู่สาธารณะ ทำให้สามารถนำไปผสานกับแอปใดก็ได้
กลไกหลัก: Agent สร้าง HTML/SVG แบบเรียลไทม์ และสตรีมเข้าสู่ sandboxed iframe
การออกแบบทางเทคนิคของ Open Generative UI:
Agent ไม่ได้เลือกใช้คอมโพเนนต์ที่เตรียมไว้ล่วงหน้า แต่จะสร้างเนื้อหาภาพจากศูนย์ทุกครั้ง
เอาต์พุตถูกสตรีม token-by-token ในรูปแบบ HTML/SVG ไปยัง iframe ที่ถูกทำให้เป็นแซนด์บ็อกซ์
iframe ถูกแยกอย่างสมบูรณ์ ไม่สามารถเข้าถึงแอปแม่ DOM หรือข้อมูลของผู้ใช้ได้
ต่อให้ Agent สร้างแท็กที่เสียหายหรือ JavaScript ที่ไม่คาดคิด ก็จะไม่รั่วไหลออกไปนอก iframe
นักพัฒนาสามารถใช้ “skill prompts” เพื่อชี้นำให้ Agent สร้างรูปแบบภาพเฉพาะได้ (เช่น dashboard ของ Chart.js พร้อมป้ายกำกับแกนพิกัด, โมเดล 3D พร้อมคุมการหมุน ฯลฯ)
การออกแบบแซนด์บ็อกซ์เป็นแนวทางมาตรฐานในการจัดการความเสี่ยงจาก “การที่ Agent สร้างโค้ดแบบใดก็ได้”—ให้ Agent สร้างได้อย่างอิสระ แต่จำกัดขอบเขตการทำงาน เพื่อไม่ให้ทำลายเส้นความปลอดภัยของแอปหลัก
ขอบเขตที่รองรับ: LangGraph/CrewAI/Mastra/Google ADK/AWS Strands
Open Generative UI สร้างบน AG-UI protocol ทำให้พร้อมใช้งานและรองรับหลายเฟรมเวิร์ก Agent ได้ทันที:
LangGraph
CrewAI
Mastra
Google ADK
AWS Strands
พร้อมกันนี้มี MCP (Model Context Protocol) เซิร์ฟเวอร์แบบแยกอิสระ สามารถเสียบใช้งานกับ Claude Code, Cursor หรือไคลเอนต์ที่รองรับ MCP อื่น ๆ ได้ ชุดโซลูชันทั้งหมดสร้างบนเฟรมเวิร์กส่วนหน้าแบบโอเพนซอร์สของ CopilotKit ซึ่งบน GitHub สะสมมากกว่า 30,000 สตาร์ และมี SDK สำหรับ React, Next.js, Angular และ Vue
ความหมายต่อผู้พัฒนา AI Agent: มาตรฐาน GenUI ข้ามเฟรมเวิร์กและข้ามโมเดล
ความหมายของการเปิดตัวครั้งนี้ต่อชั้นการประยุกต์ของ AI Agent:
ในอดีต นักพัฒนาต้องพัฒนา “dynamic UI แบบ Claude Artifacts” เองตั้งแต่เริ่ม เพื่อใส่ลงในแอปของตน
Open Generative UI มอบทางเลือกแบบโอเพนซอร์สที่รองรับข้ามเฟรมเวิร์กและข้ามโมเดล
ผ่าน MCP server ผู้ใช้สามารถเชื่อมต่อได้โดยตรงด้วย Claude Code และ Cursor
เหตุการณ์ที่อาจติดตามต่อได้ในอนาคต: อัตราการนำ CopilotKit Open Generative UI ไปใช้ในชุมชน LangChain/CrewAI, ปฏิกิริยาทางการของ Anthropic ต่อ “การเปิดโอเพนโค้ด Claude Artifacts ที่นำไปทำเป็นงานโอเพนซอร์ส” และว่าเฟรมเวิร์ก Agent อื่น ๆ จะมีความสามารถ GenUI ที่คล้ายกันหรือไม่
บทความ CopilotKit เปิดโอเพนซอร์ส Open Generative UI: การนำ Claude Artifacts ไปใช้งานในเฟรมเวิร์ก Agent ข้ามแพลตฟอร์ม เดิมทีปรากฏที่ 鏈新聞 ABMedia
news.related.news
OpenAI Codex เปิดให้บริการส่วนขยายสำหรับ Chrome: ทดสอบ Web App ในเบราว์เซอร์, ดึง Context ข้ามหน้า, ทำงานแบบคู่ขนาน
OpenAI เปิดตัว GPT-Realtime-2: นำการให้เหตุผลของ GPT-5 มาสู่เอเจนต์ด้วยเสียง และเพิ่มคอนเทกซ์ต์เป็น 128K
ผู้รับผิดชอบ Claude Code Boris: เอเจนต์ AI ยกระดับประสิทธิผลของมนุษย์ เปลี่ยนโฉมประวัติศาสตร์การพัฒนาซอฟต์แวร์
Anthropic เปิดตัว Claude Dreams: เอเจนต์จัดระเบียบหน่วยความจำให้เองระหว่างทำงาน ขจัดความซ้ำซ้อนและความขัดแย้ง
Cloudflare ร่วมมือกับ Stripe เปิดตัว Agent แบบทำงานอัตโนมัติด้วยการเจรจาเอง: AI สามารถสร้างบัญชีเอง ซื้อโดเมน และปรับใช้งานแอปพลิเคชันได้