前端进阶之旅前端进阶之旅
基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
知识卡片NEW
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 业务场景题真实业务问题与追问
  • 查漏补缺常见问题解析
  • AI 模拟面试NEW模拟真实面试 + 报告
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
    • AI 定制路线NEW按你的简历现排
    • AI 知识地图NEW串起全站知识点
  • 动态
    • AI 热点NEWAI 每日动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
AI 助手NEW
旧版
基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
知识卡片NEW
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 业务场景题真实业务问题与追问
  • 查漏补缺常见问题解析
  • AI 模拟面试NEW模拟真实面试 + 报告
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
    • AI 定制路线NEW按你的简历现排
    • AI 知识地图NEW串起全站知识点
  • 动态
    • AI 热点NEWAI 每日动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
AI 助手NEW
旧版
返回 AI 情报前线
All News · 全部资讯8655
  • Benchling 用 Bedrock AgentCore 为多租户 AI Agent 构建深度防御安全架构
  • 苹果Mac mini 2026款:M6/M5 Pro芯片,AI性能最高提升4倍
  • Mac Studio 2026:M5 Ultra 支持最高 512GB 统一内存,可本地运行超大模型
  • Grok 4.7登陆GitHub Copilot,面向Agent化编程
  • AI 安全是工程问题:Agent 堆栈每一层的防护实践
  • Agent 系统的瓶颈不是模型,是架构设计
  • 防御式 Agent 架构:Schema 注入与超时控制
  • 自研研究 Agent 拦截 AI 编程幻觉:文档先行策略
  • 像物理学家一样剪枝 LLM:区块移除的伊辛模型优化
  • Mac mini上的AI开发新范式:OpenClaw与Codex实战
  • Cloudflare Python Workers 正式上线,可用纯 Python 开发边缘应用
  • 浏览器直接给 ESP32 烧录 Claude 写的宏,无需 IDE 或工具链
  • Google 发布 Agent 安全风险报告:5 万美元循环消耗与凭证窃取案例
  • 多 Agent 合规流水线:用 RAG + 自修正架构对抗 WCAG 幻觉问题
  • Anthropic 发布金融领域 Claude 参考智能体套件
  • OpenAI 披露强化学习模型在上下文压缩时插入 Prompt 注入
  • Jev 决策模型实测:0.3秒完成意图分类和工具路由,$0.00004/次
  • Kimi Code Desktop 上线:图形界面 + 内置终端 + Git 状态,支持 Swarm 多 Agent 协
  • StepFun Step 5 Preview:600B 总参数 MoE 模型,1M 超长上下文,10 月开源
  • JSON-Render:通吃 React/Vue/Svelte/React Native 等 10+ 框架的生成式 UI
  • Agent-Native:让 Agent 能力同时暴露给 LLM 工具调用和 UI 操作的 TypeScript 框架
  • 清华联合无问芯穹开源具身智能体RPent,GPT-6 Astra注入机器人
  • AI Agent工具调用边界case:路由错误比想象中更脆弱
  • AI按它能读的契约编程,而非你想要的
  • MCP 远程服务器实现 AI 驱动的确定性 UI 编排
  • 阶跃Step 5 Preview实测:27B参数开源模型冲至Top2
  • 用Responses API构建有边界的GPT-6 Astra Agent
  • 用破坏不变量法审查 AI 生成代码
  • AI 编程测试冻结:保存异常指纹而非测试名
  • 程序员亲历:全公司用 Claude Code 批量生产代码,没人读代码,12 小时工作制
  • 自托管Llama部署成本全解析:GPU之外容易被忽视的隐性开销
  • Builder.io开源Agent-Native框架:让人与AI共享同一操作层
  • 让AI编程代理在中断后从断点恢复:session化执行轨迹方案
  • CI如何验证AI代理真的跑了测试而不是伪造结果
  • llm-keys-ui:让Coding Agent安全获取API密钥的插件
  • AI产品定价数学:固定费率如何悄悄亏损
  • ZCode事件:AI编程工具静默上传全部Git历史
  • Anthropic自评:R&D自动化率26%,但完全自主为0
  • 阿里Qwen-Image-2.1:70亿参数开源图像生成拳打闭源模型
  • OWASP CRS 规则引擎:给 LLM 和 MCP 加上 WAF
  • 智谱 MaaS 上线数据不留存机制,可申请开通
  • 如何界定可完成的AI工程范围
  • Cursor中直接查询技术文档的MCP方案
  • AI Agent的过度自信陷阱
  • Cursor与.NET周报:七个实战规则
  • AI Agent失效?模型可能不是根源
  • Qwen-Image-2.1开源:7B参数兼顾生图与编辑
  • 阿里开源 Qwen-Image-2.1:7B 参数兼顾透明图生成与多图编辑
  • 免费模型Trace不能支持的五个评估主张
  • AI重构前的副作用冻结术:先录 Ledger 再动格式
  • Agent能改Oracle则Green Build不足为信:独立检查三原则
  • 已加载 51 / 8655
8.0
热点
AI SCORE
编程提效2026-09-21 14:30

Agent-Native:让 Agent 能力同时暴露给 LLM 工具调用和 UI 操作的 TypeScript 框架

GitHub Trending#TypeScript#Agent#开源框架
Editor brief · 编辑速览

该框架将 Agent 能力统一封装为「共享 Action」,LLM 工具调用和 UI 代码调用走同一套验证、权限和实现逻辑,适合需要人机协同审查的复杂工作流。

文章思维导图
Knowledge map
拖拽缩放
Full translation

完整中文译文

Agent-Native 是一个开源 TypeScript 框架,用于构建将自主工作与专用 UI 配对的 Agent。将每个能力定义为一个 action:Agent 将其作为工具使用,UI 从代码中调用它。

npx --yes @agent-native/core@latest create my-agent --standalone --template chat

按照入门指南获取框架的完整介绍。

为什么用 UI 来构建 Agent?

编码 Agent 不只和一个文本框打交道。它的环境提供上下文、工具、文件、测试和预览,让它的能力和结果变得可见。

知识工作同样需要这种环境。UI 展示 Agent 能做什么,并为人们提供熟悉的方式来检查、编辑、批准和分享其工作成果。

Agent-Native 的工作原理

共享 actions。 Agent 将每个能力作为工具调用,UI 从代码中调用它。两条路径使用相同的验证、权限和实现。

共享数据。 Agent 完成的工作显示在 UI 中,UI 中完成的工作可供 Agent 使用。

共享应用状态。 Agent 接收相关的 UI 状态,如当前页面、选中的记录或活动视图。

Agent 不通过 UI 点击操作。它通过与 UI 相同的 action 层来工作。

示例:一个共享 action

创建 actions/hello.ts:

import { defineAction } from "@agent-native/core/action";
import { z } from "zod";

// One action powers every app surface: UI, agent, HTTP, MCP, A2A, and CLI.
export default defineAction({
  description: "Return a friendly greeting.",
  schema: z.object({
    name: z.string().default("world").describe("Name to greet"),
  }),
  http: { method: "GET" },
  run: async ({ name }) => {
    return { message: `Hello, ${name}!` };
  },
});

Agent 将 hello 作为工具接收。React 用 useActionQuery("hello", { name: "Alex" }) 调用同一个函数。Agent-Native 还通过 HTTP、MCP、A2A 和 CLI 暴露它。

功能特性

Agent 聊天: 让用户在同一个 UI 中委托工作、提问和查看结果。

认证与权限: 控制谁可以访问和修改共享工作。

技能与记忆: 为 Agent 提供可复用的专业知识和持久上下文。

自动化: 按计划或事件运行 Agent 工作。

Agent 团队: 在同一工作空间或跨连接的 Agent 中将工作委托给专业 Agent。

PostgreSQL 后端: 生产环境使用 PostgreSQL,本地开发使用 PGlite,可在任何兼容 Nitro 的主机上运行。

Bring your LLM, SQL database, tools, and infrastructure. Everything you build stays yours.

实际应用

查看 Agent-Native 的实际运行效果:

从以下这些 Agent 开始,或将其作为自己项目的参考。

  • 录制并理解会议、屏幕录制和语音笔记。
  • 生成和完善交互式设计。
  • 创建和编辑品牌化演示文稿。
  • 对数据提问并构建仪表板。
  • 查找时间、安排事件和管理预约。
  • 优先处理邮件、起草回复并跟进。
  • 创建和组织品牌化媒体。
  • 起草、整理和发布内容。
  • 用图表、线框图和原型创建和审查视觉计划。

Explore the full app gallery, or start with the framework guide.

文档与社区

阅读文档。

加入 Discord 提问、分享你的作品并获取帮助。

Working on this repository itself? See DEVELOPMENT.md for local setup, workspace structure, and guard scripts.

Original source

本文由 AI 翻译整理自 GitHub Trending,原文版权归原作者所有。

阅读英文原文
上一篇
JSON-Render:通吃 React/Vue/Svelte/React Native 等 10+ 框架的生成式 UI
下一篇
清华联合无问芯穹开源具身智能体RPent,GPT-6 Astra注入机器人