Asana 在浏览器代理测试中实现 76倍成本降低与 5倍速度提升
- 作者

- 姓名
- Nino
- 职业
- Senior Tech Editor
随着自主 AI 代理(Autonomous AI Agents)在企业级应用中的快速普及,如何在保障高准确率的同时降低 API 费用并提升响应速度,已成为所有 AI 团队的核心挑战。虽然早期的浏览器自动化代理展现出了强大的能力——能够跨复杂的 Web 应用程序导航、填写多步骤表单并提取结构化数据,但在实际生产部署中,昂贵的 LLM API 成本与极高的延迟成为了巨大的瓶颈。单次自动化流程运行可能会消耗数十万个 Token,耗时超过一分钟,且单次事务的费用高达数美元。
在最新的基准测试中,知名工作区管理巨头 Asana 展示了一项突破性的工程成果:通过对其自主浏览器代理流程进行深度架构优化,在测试中成功将大模型推理成本降低了 76倍,并将执行速度提升了 5倍。通过结合专用的模型流水线、优化的代理执行引擎循环以及精简的上下文提炼技术,Asana 将基于浏览器的 AI 自动化从昂贵的实验性功能转化为了高性价比、实时的企业级实用工具。
本文将对现代浏览器代理如何实现这种极端的成本与延迟优化进行深入的技术分析,分享开发者如何重构其 LLM 工作流以获得类似的收益,并探讨统一 API 平台如 n1n.ai 如何为生产级代理部署提供必要的基础设施支持。
传统浏览器代理的技术瓶颈
要理解 76倍的成本降低是如何实现的,我们必须首先分析为什么传统的 Web 浏览 LLM 代理会消耗如此多的资源。早期的实现方式依赖于在每个单独的操作步骤中,将完整的 DOM 结构或高分辨率的屏幕截图发送给前沿模型(例如 GPT-4o 或 Claude 3.5 Sonnet)。
Token 爆炸问题
以典型的企业级软件页面为例(例如 Asana 的项目看板或 Salesforce 仪表板),此类应用的原始 HTML 载荷通常会超过 1MB 到 3MB,相当于 15,0000 到 40,0000个原始 DOM Token。即使剔除了脚本与样式文本,原始 DOM 树中依然保留了大量冗余的 <div> 容器、样式属性、内联 SVG 以及追踪脚本。
当代理在闭环中运行(观察 → 思考 → 动作 → 验证)时:
- 步骤 1(观察):代理接收完整的页面 DOM(200,000个输入 Token)。
- 步骤 2(动作):代理发出
click("#submit-btn")指令。 - 步骤 3(再次观察):代理重新评估页面状态,再次发送 200,000个输入 Token。
- 步骤 4(多步骤流程):一个包含 10个步骤的表单填写流程将累计消耗超过 2,000,000个输入 Token。
按照标准企业 API 每百万输入 Token 2.50 到 5.00 美元的费率计算,单次浏览器动作执行的成本就在 5.00 到 10.00 美元之间。此外,每个推理步骤处理 200,000个 Token 会引入 5 到 15秒的首个 Token 延迟(TTFT)及端到端延迟,使得交互式用户体验完全无法接受。
Asana 实现 76倍成本削减的核心技术支柱
同时实现 76倍的成本下降与 5倍的速度提升,需要多层面的架构重构,而非单一的技术手段。这一转型背后的核心推动力包括:
1. 无障碍树(AXTree)抽象
现代高效代理不再将原始 HTML 或全分辨率视觉张量直接喂给 LLM,而是提取浏览器原生的 无障碍树(Accessibility Tree / AXTree)。AXTree 剥离了所有样式、脚本和布局容器元素,仅保留交互式节点(如 button、input、link、aria-label)以及语义文本。
- 原始 HTML 大小:~250,000 Token
- 提取后的 AXTree 大小:~3,500 Token
- Token 降幅:在模型评估前即实现 ~98.6% 的 Token 削减。
2. 分级模型分层与动态路由
并非代理循环中的每个步骤都需要顶级前沿模型来进行复杂推理。Asana 的架构根据任务复杂度对任务进行分发:
- 规划与意图拆解:由高容量推理模型处理(例如 Claude 3.5 Sonnet、GPT-4o)。
- 元素定位与表单 Schema 提取:由快速、轻量级的模型处理(例如 Claude 3.5 Haiku、DeepSeek-V3 或经过微调的小型模型)。
- 动作执行验证:通过确定性代码脚本在本地进行评估(JavaScript DOM 断言)。
通过利用来自 n1n.ai 的高性能 LLM 基础设施,开发者可以将简单的元素解析调用动态路由到高吞吐量的 API 端点,同时将昂贵的推理过程保留给边缘情况的恢复处理。
3. 状态增量解析(State Differential Delta Parsing)
优化后的代理不再在每次操作后重新发送页面的完整状态,而是维护一个滚动状态机。当动作发生时,浏览器代理会计算 DOM 增量(DOM Delta)——仅将已修改、新添加或已删除的节点发回 LLM 上下文缓冲区。结合 提示词缓存(Prompt Caching) 技术,重复的基础上下文成本可降至接近于零。
实战代码:构建企业级高效率浏览器代理
以下是一个基于 Python 的生产级实现示例,结合了 playwright 与 httpx,展示了 AXTree 提取、提示词缓存结构以及通过 n1n.ai 路由统一 LLM API 调用。
import asyncio
from json import json
from playwright.async_api import async_playwright
import httpx
# 配置 n1n.ai 统一 API 节点
N1N_API_KEY = "your_n1n_api_key_here"
N1N_BASE_URL = "https://api.n1n.ai/v1"
async def get_accessibility_tree(page):