Arrow
正常简介
Arrow 是面向 Agentic 时代的前端 UI 框架，体积小巧、性能优异，内置 WASM 沙箱实现安全代码执行，专为构建 AI Agent 交互界面而设计。
核心特性
- 基于 JavaScript 模块、模板字面量和 DOM 原语构建的极小极速响应式 UI 运行时
- 内置 WASM 沙箱（基于 QuickJS），安全执行代码且与宿主 window 环境隔离
- 通过 `@arrow-js/ssr` 和 `@arrow-js/hydrate` 包完整支持服务端渲染和水合
- 类型安全的响应式状态管理，API 面精简，专为编码 Agent 设计
- 通过 `npx @arrow-js/skill` 集成 Agent 技能，方便将 Arrow 添加到现有项目
- 核心运行时无需构建步骤——可通过 ESM 直接在浏览器中导入使用
适用场景
💡 以最小开销构建响应式 AI Agent 交互界面
💡 在 Web 应用中创建沙箱化代码执行环境
💡 需要快速水合和交互性的服务端渲染应用
💡 为 AI 驱动的仪表板开发轻量级前端组件
💡 利用热模块替换和即时反馈快速原型化 Agent UI
标签
快速开始
1. 脚手架完整应用：`pnpm create arrow-js@latest arrow-app`
2. 或仅安装核心：`npm install @arrow-js/core`
3. 创建响应式组件：
```ts
import { component, html, reactive } from '@arrow-js/core'
const Counter = component(() => {
const state = reactive({ count: 0 })
return html`<button @click="${() => state.count++}">Clicked ${() => state.count} times</button>`
})
html`${Counter()}`(document.body)
```
4. Agent 技能集成：`npx @arrow-js/skill`