热门产品

Persona.js

Persona.js

Persona.js 是一个轻量级开源 AI 聊天 UI 库,适用于任何前端,无需框架,支持流式聊天和语音,帮助开发者快速集成 AI 助手。

热门评论

PH 用户
嘿 Product Hunt 👋 我是 Nathan,Runtype 联合创始人,也是 Persona 的构建者之一。

Persona 是世界上首个原生支持 WebMCP 的 AI 聊天库。它是一个与框架无关的聊天 UI,可以嵌入任何现有网站或应用,轻松为你的产品添加 AI 能力。

为什么做这个

大多数 AI 聊天库都假设你在 React 上从零开始。Persona 是为剩下的互联网打造的:现有网站、混合前端栈、专有 CMS,以及那些想要现代 AI 体验但不想用 React 重构的团队。无需构建步骤即可嵌入,通过配置和内置编辑器调整整体外观,然后以聊天 widget、全屏 ChatGPT/Claude 风格界面(带 artifacts)或介于两者之间的形式交付。

开箱即用看起来很专业,无需代码就能走得很深的自定义路径,同时为想深入开发的开发者提供 hooks 和插件。

它基于 Vanilla JS 构建,因此可以在任何地方运行——WordPress、Shopify Liquid、静态 HTML 页面等等。

我们最兴奋的部分:WebMCP 🧩

Persona 是首个原生支持 WebMCP 的智能体 UI 框架,WebMCP 刚刚在 Chrome 中推出,并为所有其他浏览器提供了 polyfill。通过 WebMCP,你可以直接在 frontend 注册面向智能体的工具,让基于 Persona 的智能体能够以远超其他方式(无头浏览器、DIY frontend 工具等)的灵活性和 token 效率直接使用你的前端应用。

如果你已经有一个复杂的 web 应用,与从头构建全新后端相比,这可能是为应用启用 AI 能力的更快路径。由于 WebMCP 工具可以直接挂接到前端代码,体验更像是一个“copilot”而不是附加品,所有常见的副作用和 UX 都得以保留,而你的应用变得更强大。

一些酷炫的 demo:Fullscreen Assistant → persona-chat.dev/fullscreen-assistant-demo.htmlSlides → persona-chat.dev/webmcp-slides.htmlCalendar → persona-chat.dev/webmcp-calendar.htmlMSPaint → persona-chat.dev/webmcp-paint.htmlWebMCP 正在成熟,值得开始针对它构建,而 Persona 通过内置 polyfill 让这件事变得简单。

开源,无锁定

Persona 采用 MIT 许可证,是开源的。它由一家 AI 平台公司开发,但刻意不与 Runtype 耦合。你可以在任何框架上部署它,并用少量胶水代码将其连接到任何基于 SSE 的 AI 端点。仓库中提供了流行框架(如 Flue、Eve、OpenAI Agents SDK 等)的示例以及文档,你现有的编码工具可以快速实现它。

如果你想尽快部署一个聊天智能体,CLI 命令:

npx @runtypelabs/cli@latest persona init

……能在几分钟内让你在 Runtype 平台上拥有一个支持 WebMCP 的聊天智能体。

适用人群

那些正在为已有产品添加 AI 体验、不想重写、且希望享受我们对前沿 AI 体验细节的痴迷成果,从而直接部署的构建者。

仓库、文档和示例:github.com/runtypelabs/persona

欢迎反馈!如果你曾尝试将 AI 添加到现有应用中,我很好奇最难的是什么:选择合适的框架、搭建新后端、连接工具、构建恰当的评估,还是信任 AI 实际做的事情?很高兴在评论中深入讨论 WebMCP。
PH 用户
WebMCP 原生的角度是我一直在琢磨的点,因为你说工具注册可以调用页面上的任何 JS 函数。这有利有弊。一旦智能体能驱动真实 UI,如何防止它误判用户意图而触发破坏性或付费操作?高风险的工具有没有作用域或确认层,还是安全完全由开发者负责,只注册安全的工具?好奇你们如何划定边界。
PH 用户
开箱即用的 WebMCP 支持是一个巨大的卖点,目前最大的痛点是如何避免简单前端状态就被消耗大量 token。恭喜发布 @runtypical👏 请问:内置的 polyfill 能否优雅地处理旧浏览器回退,还是会有性能损失需要注意?
PH 用户
WebMCP 原生的角度吸引了我——注册前端工具让智能体驱动真实 UI 而不是无头浏览器,感觉干净多了。对于现有的 React/Next 应用,你能精细到哪些粒度来暴露工具?恭喜发布。
PH 用户
框架无关的做法引起了我的注意——大多数聊天 UI 都是 React 优先,这会悄悄锁定你的架构。WebMCP 原生集成是正确的赌注,因为 MCP 正成为 AI 工具的标准接口层。快速问题:当 MCP 服务器需要用户特定权限时,Persona 如何处理认证上下文?是由宿主页面完全管理,还是库中有内置机制来传递 token?
PH 用户
The WebMCP 的角度让我觉得这不仅仅是一个普通的聊天组件。

作为开发者,我关心的安全/可用性细节是清晰的工具调用预览:助手即将使用哪个页面工具、会改变什么状态、用户能撤销什么。

对于现有应用,可怕的部分不是添加聊天,而是让智能体接触真实的 UI 流程,却不让每个操作变成黑箱。如果 Persona 能默认让这些副作用可见且可逆,那将大大降低信任门槛。
热门产品Nathan Booker2026-06-28原文

相关内容