我们如何构建出超越 Fable 的 SOTA 浏览器 Agent

@hyojun_at
英语3周前 · 2026年6月25日
192K
322
14
26
658

TL;DR

Aside 是一款全新的 AI 驱动浏览器,它通过自定义 Chromium 分支和 JS REPL 工具链,在 Online-Mind2Web 等 Agent 浏览基准测试中实现了业界领先的成果。

Aside 在多个 Agent 浏览基准测试中获得了最高分。互联网不相信我们,说我们的说法全靠"相信我啦兄弟"。

好吧。说实话,一开始我们自己也不信。但请相信我,我们花在验证结果上的时间比跑基准测试本身还多。

但这绝非运气。我们从零开始构建了 Agent 框架,并严格遵循我们自己的设计原则。在这篇文章中,我们将分享我们的秘诀

什么是 Aside?

Aside 是一款专为在你已使用的网站上完成实际工作而设计的浏览器。

我是个超级浏览器爱好者,但对 Dia、Perplexity Comet 和 ChatGPT Atlas 感到失望,因为它们的 Agent 太笨了,连一个任务都完不成。

jun - inline image

所以我们从零开始构建了一款真正的 AI 浏览器:

  • 轻量且快速的 Chromium 分支。精心打磨的设计细节。
  • 它像你一样直接使用你已登录的账号。无需集成,无需 API 对接。
  • 它通过本地嵌入模型驱动的自我组织记忆来记住你的工作。
  • 凭证会自动填入页面,但绝不会暴露给模型。敏感操作会等待你的批准。

aside.com

基准测试结果

我们在三个浏览器 Agent 基准测试中排名第一:Online-Mind2Web、BU-Bench-V1 和 Odyssey。所有基准测试的运行数据均已发布在 https://github.com/at-inc/aside-benchmarks 上。

Online-Mind2Web

最广泛报道的浏览器 Agent 基准测试。涵盖 136 个实时网站的 300 个真实世界任务,覆盖各种消费者工作流程。这是每个网页 Agent 都会被拿来比较的标准。

jun - inline image

Aside + GPT 5.5 99.0%。带有 CUA 的 GPT-5.4 得分为 92.8%,Opus 4.8 + Claude Code(Playwright MCP)在我们的测试中得分为 84.0%,ChatGPT Atlas 得分为 70.0%

Odyssey

Odyssey 是 CMU 的长期任务基准测试。200 个来自真实用户浏览历史的多站点任务,例如"规划一次覆盖所有 30 个 MLB 球场的旅行"或"比较在洛杉矶租用特斯拉 Model 3 与 1 万美元以下的拖车替代方案"。

jun - inline image

Aside 使用 GPT 5.5 得分 75.5%,创下最高纪录。

BU-Bench-V1

Browser Use 的开放基准测试。100 个从 WebBench、Mind2Web 2、GAIA 和 BrowseComp 中精心挑选的高难度任务。

jun - inline image

Aside + GPT 5.5 达到 93.0%。Fable 5 + Claude Code(Playwright MCP)在我们的测试中得分为 80%,而 Fable 5 + Browser Use OSS 同样得分为 80%

有趣的是:Aside + Kimi K2.6 甚至超过了 Fable 5 + Claude Code。

jun - inline image

但用你的框架去比较模型性能,这不是没意义吗?

没错。你说得对,抱歉我这是在故意引战。

但我想讨论的是我们框架的效率。

框架非常重要。模型仍然决定了能力上限,但通过构建更好的 Agent 框架,你还有很大的优化空间。

我们如何构建最智能的浏览器框架

我们的大部分框架都是从零开始构建的。

我们选择 pi-mono/core 作为基础,但我们必须在其之上自己构建所有其他东西(例如压缩、技能、钩子、沙箱、REPL、bash 和浏览器自动化),因为我们要坚持自己的原则。

设计原则

1. 遵循模型的训练数据。

Aside 是一个编码 Agent。是的,你没听错。当我最初设计 Aside 时,我问自己:LLM 见过最多的数据是什么?是代码。

当我在 2016 年开始 ML 研究时,我的核心信念很简单:所有 ML 模型都只是统计非线性函数。因此,如果你自己不是构建前沿模型的人,那么最好的选择就是遵循它们的训练数据分布。

这就是为什么我们的核心工具是一个基于 Playwright 语法构建的 JS REPL,因为它是使用最广泛的。

2. 最少的指令带来更高的智能。

我们发现,幻觉和愚蠢行为主要来自两个方面:对当前状态的描述不佳,以及相互矛盾的指令。

因此,我们保持系统提示精炼。我们的系统提示(包括工具定义)仅占用 10K tokens。而 Claude Code 则消耗 20K tokens。

我们也绝不让 AI 编写提示词。 这只会制造垃圾内容叠加垃圾内容。在基准测试上运行自动研究会产生一大堆刷分规则,比如"当 X 发生时,执行 Y"或"永远不要做 A、B、C"。

3. 保护上下文窗口

上下文窗口中的无用 token 是万恶之源。当工具输出充满噪音(例如,div 和样式占内容 90% 的 DOM 捕获)或指令因无关细节而臃肿时,模型性能会迅速下降。

一个好的框架可以保持工具输出的高信号和低噪音。 例如,CDP 或原始 DOM 对于浏览器控制来说是一个糟糕的选择。该协议对于模型来说过于原始,难以有效解析。这就是为什么我们使用自定义的 a11y 树。

4. 站在巨人的肩膀上。

我们并非一切从零发明。我们借鉴了优秀的开源项目:Codex、Claude Code、OpenCode、oh-my-opencode 等。

Aside 是一个编码 Agent。

Aside 基本上是一个编码 Agent。我们只有两个核心工具:REPL 和 bash。Aside 编写 Playwright JS 代码来控制浏览器,这与使用专用浏览器控制工具集的 OpenClaw 或 Hermes 不同。

jun - inline image

为什么选择 JS REPL? 因为它非常接近模型的训练数据,并且代码是表达逻辑和数据最清晰的方式。这在真实任务中至关重要。Aside 可以填写复杂的表单并逐帧检查 YouTube 视频,因为 Agent 可以编写代码。

有时,Aside 会逆向工程网站的 API。 如果页面阻止了正常路径,它会捕获网络请求,找出内部 API,并将其作为变通方案。该请求看起来与网站自身的请求完全相同,因此不会被标记为机器人。我很喜欢这一点,因为让 Aside 更接近编码 Agent 产生了这些聪明的副作用。

jun - inline image

Playwright 是 LLM 已经知道的浏览器语言

为什么选择 Playwright?因为它是 LLM 见过最多的浏览器自动化 API。OpenAI 甚至表示 GPT-5.4 经过训练可以很好地使用 Playwright。我的第一反应很简单:如果模型已经知道这个接口,为什么还要发明一个新的呢?

最令人惊奇的部分是,我们的提示 没有教授 Playwright 语法。Playwright MCP 花费 13K tokens 来解释它。我们只是说"Playwright 可用"。Aside 的表现仍然更好,因为我们节省了 tokens 并避免了额外的指令。

附注:CDP 是个坏主意

最近,我们看到了一股使用 CDP 进行浏览器控制的趋势。我们认为这通常是一个坏主意(抱歉 browser-harness)。从工程师的角度来看,它看起来很完美:一个接口搞定一切。但问题很简单:

  • LLM 没有接受过使用 CDP 的训练
  • CDP 是一个低级调试器协议
  • 它浪费 tokens,并且 LLM 很难使用它

正如我之前所说,最好不要与 LLM 的训练数据分布对抗。关键在于选择正确的抽象层,一个模型已经理解的抽象层。

Playwright → Asidewright

但 Playwright 臃肿且沉重,因为它专为 E2E 测试自动化设计,而不是为 Agent 设计的。所以我们制作了自己的版本:Asidewright。

  • 对 LLM 友好:接口与 Playwright 100% 相同
  • 轻量级:每个 API 都是围绕 CDP 方法的、有主见的轻量封装。没有注入脚本、中间层或臃肿代码。
  • Token 高效:比 agent-browser 最多节省 80% 的 tokens
  • Agent 信号:向 Agent 报告异步事件并附带引导信息,例如弹出窗口已打开、下载已开始和标签页已关闭。

Token 高效的 a11y 快照

最近网页交互的规范是无障碍树。Claude、agent-browser、Playwright MCP 和 OpenClaw 都使用带有引用 ID 的无障碍树来标识可交互元素。

我们构建了自己的修改版无障碍树。我们通过启发式方法移除了许多中间元素,并添加了有助于 LLM 的信息,例如焦点状态、iframe ID 和可点击状态。

在快照 aside.com/sota 并与 agent-browser 进行比较后,Aside 的输出 小了 70%,并且关键信息集中在前端。这意味着当工具结果被截断时,Agent 遗漏关键细节的可能性大大降低。

jun - inline image

备选方案:带截图的计算机使用

当然,有些网站无法通过 DOM 进行控制。我们向 Asidewright 添加了一个 CUA 接口,以便 Aside 在需要时可以使用视觉信息和点击坐标。

使其在真实用户浏览器中工作的技术细节

构建一个无头浏览 Agent 与构建一个驻留在真实用户浏览器内的 Agent 非常不同。

后台打开的标签页。 基于 Chrome 扩展的 AI Agent 每次都会抢夺用户的焦点。我们修改了 Chromium 的 Blink 引擎,以便 Agent 打开的标签页不会获取焦点、弹出窗口或中断用户的前台任务。

jun - inline image

避免机器人检测。 我们使用了与 Browserbase 和 Browser Use 相同的技术修改了 Chromium 内部机制。

视口锁定为 1440x900。 如果你使用过 Codex Browser,你就会看到混乱:每次调整屏幕大小,浏览器窗口都会变化,每个操作都会中断。

我们修改了 Blink,使得 Agent 在后台打开的标签页始终以 1440x900 渲染,无论用户的窗口大小如何。

jun - inline image

Aside 的后台标签页模式:Aside 将视口锁定在恒定大小。

额外好处:大多数 CUA 训练数据都是这个分辨率,所以 CUA 模型在此分辨率下表现更好。记住第一条原则:遵循模型的训练数据。

结论

说 Aside 击败了 Fable 这个说法,坦白说有点引战。但在过去的四个月隐身开发期间,我们构建了一个具有顶级性能的 SOTA Agent。这源于实验、研究和大量精心的工程工作。

我们如此在意,是因为 Aside 是一个将网站作为工具来为用户完成日常工作的 Agent。现实世界的工作通常比编码更混乱。这使得一个精心构建的框架对于通用 Agent 来说,比人们想象的要重要得多。

好奇吗?立即下载 Aside:Aside.com

一键保存

使用 YouMind AI 深度阅读爆款文章

保存原文、追问细节、总结观点,并在一个 AI 工作空间里把爆款文章沉淀成可复用笔记。

了解 YouMind
写给创作者

把你的 Markdown 变成干净的 𝕏 文章

图片上传、表格、代码块,往 𝕏 上手动重排太痛苦。YouMind 把整篇 Markdown 一键转成干净、可直接发布的 𝕏 文章草稿。

试试 Markdown 转 𝕏

更多可拆解样本

近期爆款文章

探索更多爆款文章