Overview
Persona.js and Skybridge are both open-source JavaScript libraries for building AI-powered user interfaces, but they serve very different purposes. Persona.js is a lightweight, framework-agnostic chat widget that you can embed into any website with a single script tag. Skybridge is a full-stack React framework for building MCP (Model Context Protocol) apps that run inside AI assistants like Claude and ChatGPT.
Persona.js
Persona.js is built by the team at Runtype. It's a vanilla JavaScript library that adds an AI chat interface to any website, from static HTML to modern SPAs. It's framework-free, backend-agnostic, and WebMCP-native, meaning it can discover and execute tools exposed by the parent page. You can add streaming chat, voice, theming, and interactive copilot experiences without rebuilding your frontend or writing bespoke APIs.
Skybridge
Skybridge is a React framework for building MCP apps – interactive applications that run inside AI assistants. It handles the MCP server, view rendering, client compatibility, testing tunnel, and more. With over 500K downloads, it's designed to let developers code once and ship to multiple AI assistants (Claude, ChatGPT, VSCode) seamlessly.
Feature Comparison
| Feature | Persona.js | Skybridge |
|---|---|---|
| Primary Purpose | Embed AI chat UI into any website | Build full MCP apps for AI assistants |
| Framework Dependency | None (vanilla JS) | Requires React |
| Integration | Script tag or npm, mount on any element | Full-stack TypeScript framework with CLI |
| Backend | Backend-agnostic, SSE streaming | Built-in MCP server with Zod validation |
| UI Modes | Floating, docked, fullscreen | React components rendered inside AI assistant |
| Tool Integration | WebMCP (page tools via document.modelContext) | MCP (server-registered tools with React views) |
| Styling | Shadow DOM isolation, token-based theming | Standard React styling |
| Dev Tools | Minimal (CDN/npm) | CLI, HMR, emulator, tunnel, audit |
| Target Clients | Any website | Claude, ChatGPT, VSCode, any MCP client |
| License | MIT | MIT |
Pricing
Both Persona.js and Skybridge are completely free and open-source under the MIT license. There are no paid tiers or usage limits for either library. Persona.js offers an optional Runtype cloud service for hosted agents (pricing not disclosed), but the core library is free. Skybridge has no paid offerings.
Pros and Cons
Persona.js
Pros:
- Framework-agnostic – works with any tech stack (React, Vue, static HTML)
- Extremely lightweight and fast to integrate (script tag or npm)
- WebMCP-native – agents can use existing page tools without backend changes
- Shadow DOM isolation prevents style conflicts
- Multiple UI modes (floating, docked, fullscreen) with simple config
- Pluggable SSE parsers for any backend
Cons:
- Limited to chat/assistant UI – not a full app framework
- No built-in dev server or HMR for widget development
- Smaller community and ecosystem compared to React-based solutions
Skybridge
Pros:
- Full-stack framework for building MCP apps (server + React views)
- Excellent DX: CLI, HMR, local emulator, public tunnel, app audit
- tRPC-style type inference from server to React components
- Works across multiple AI assistants (Claude, ChatGPT, VSCode)
- Recommended in OpenAI documentation and developer blog
- Growing community with 500K+ downloads
Cons:
- Requires React – not suitable for non-React projects
- Steeper learning curve for developers new to MCP or React
- Tied to MCP ecosystem – not for general website chat widgets
- Heavier dependency footprint compared to vanilla JS solution
Verdict
Choose Persona.js if you need a lightweight, framework-free AI chat widget to embed in any website, especially if you want to leverage existing page tools via WebMCP. Choose Skybridge if you're building a full MCP app that runs inside AI assistants like Claude or ChatGPT, and you want a React-based framework with excellent developer tooling. Both are open-source and free, but serve fundamentally different use cases.
Persona.js
Skybridge