当 AI 代理从命令行环境走向真实 Web 世界时，一个根本性的工程挑战浮现：如何让大语言模型以可承受的成本理解并操作复杂的网页界面。传统方案将完整 DOM 或带标注的截图传递给模型，单个页面的 token 消耗便轻易突破数万甚至数十万 token。这种开销不仅推高运营成本，更在多步骤任务中造成上下文窗口的线性膨胀，导致任务失败率急剧攀升。2026 年，针对这一瓶颈的专项解决方案开始涌现，DOM 压缩、选择性渲染与增量更新三大核心技术构成了 token 高效浏览器架构的基础支柱。
核心挑战：从完整 DOM 到语义快照的鸿沟
理解 token 高效浏览器的设计动机，首先需要看清传统方案的局限性。当前主流的 AI 代理浏览器实现通常采用两种快照策略：基于视觉的 GUI 截图与基于结构的 DOM 序列化。前者模拟人类视觉感知，但图像预处理会不可逆地影响分辨率，使得精确定位交互元素变得困难；后者保留了完整的 DOM 树结构，天然与大语言模型的 HTML 理解能力对齐，却面临严重的规模问题。现实世界中的 DOM 大小常常超过 1 兆字节，折算成输入 token 可达 1e5 以上 token 量级。相比之下，典型截图在模型端的 token 估计量仅为 1e3 量级。这种数量级的差异使得直接使用 DOM 快照变得不切实际，而过度依赖视觉方案又损失了结构信息的精度优势。
解决这一矛盾的核心思路是开发智能的 DOM 降采样算法，在大幅压缩体积的同时保留对 AI 代理任务完成至关重要的 UI 特征。UI 特征在这里被定义为能够帮助用户（无论是人类还是 AI 代理）完成特定应用任务的可声明信息。这包括交互元素（按钮、输入框、链接）、内容结构（标题、段落、列表）以及语义层次（导航区域、主要内容区、侧边栏）。理想情况下，降采样后的 DOM 应当保持与原始页面同等的任务可完成性，同时将 token 消耗控制在与视觉方案相当的量级。
DOM 压缩算法：从信号处理到语义保留
2026 年最受关注的 DOM 压缩方案是 D2Snap 算法，该方法借鉴了信号处理领域的降采样思想。传统降采样技术通过局部合并数据块来减少规模，同时假设大部分关键信息得以保留 —— 正如 JPEG 图像对像素块进行平均编码一样。D2Snap 将这一思想应用于 DOM 树的语义压缩，其核心创新在于针对三种不同类型的 DOM 节点采用差异化的处理策略，并通过可配置的参数实现压缩力度与信息保留之间的灵活平衡。
D2Snap 算法引入三个位于 0 到 1 区间的压缩参数，分别控制不同类型节点的降采样强度。参数 k 控制元素节点的层次合并比率，决定容器元素的保留密度；参数 l 控制文本节点的摘要比例，通过 TextRank 算法筛选最具信息量的句子；参数 m 控制属性节点的过滤阈值，剔除语义权重较低的属性。这三个参数可以独立调节，使得算法能够针对不同类型的网页和任务需求进行优化配置。
在元素节点处理层面，D2Snap 首先根据预定义的语义评分体系将元素划分为容器、内容、交互和其他四类。容器元素（如 div、section、main）负责声明页面层次结构和内容分区，其处理方式是通过 k 参数控制层次合并的激进程度。当 k 设为 0.5 时，高度为 4 的 DOM 树将压缩至高度 2；k 值趋近 1 时则趋向完全线性化。合并操作采用后序遍历进行，保留语义评分较高的元素作为合并目标，处理命名冲突并迁移子节点。内容元素（如 p、h1、table）则被转换为更精简的 Markdown 表示，在保留语义等价性的同时显著减少标记开销。交互元素（如 button、input、a）被完整保留，以确保 AI 代理能够直接推断交互目标。实验评估表明，经过 D2Snap 压缩的 DOM 快照可将字节规模减少约 96%，从原始的 1e6 量级降至 1e4 量级，与基于 GUI 的快照达到同一 token 量级水平。
文本节点的压缩采用 TextRank 算法进行句子级别的摘要。该算法基于词语共现关系计算句子重要性得分，随后按参数 l 指定的比例剔除得分最低的句子。这种方法的优势在于保留了文本的整体语义轮廓，同时剔除了冗余或信息量较低的填充内容。对于产品描述、新闻文章等以文本为主的页面，l 参数通常可设置在 0.3 至 0.6 之间，在压缩率和信息保留之间取得良好平衡。
属性节点的过滤基于预定义的语义评分表展开。评分较高的属性（如 href、alt、id、aria-*）被保留，因为它们对于理解元素的用途和状态至关重要；评分较低的属性（如 style、data-* 中无明确语义的字段）则被移除。m 参数控制评分阈值，允许根据具体场景调整过滤力度。这一层级的压缩对于高度依赖内联样式和 JavaScript 数据绑定的现代 Web 应用尤为重要。
选择性渲染：任务相关的可见性过滤
DOM 压缩解决的是 "如何表示页面" 的问题，而选择性渲染回答的是 "需要呈现什么" 的问题。在 AI 代理的实际任务场景中，代理往往只需要与当前任务相关的页面子集，而非全部内容。例如，当代理需要完成 "查找纽约至洛杉矶最便宜航班" 的任务时，页面顶部的导航栏、侧边栏的广告模块、底部的版权声明等区域都可以安全地被排除在快照之外，因为它们与核心任务目标无关。
选择性渲染的第一层策略是可见性过滤。该策略基于视口（viewport）概念，只保留当前用户可见区域内的 DOM 节点或其语义摘要。对于单页应用和长滚动页面，这一策略能够显著削减折叠区域带来的开销。但可见性过滤的局限在于，它假设代理只关注 "当前可见" 的内容，而忽视了隐式相关的节点 —— 比如某个表单的提交按钮虽然可见，但理解该按钮的功能可能需要查看其所属表单的整体结构。
第二层策略是任务相关的语义过滤。这一策略需要结合任务上下文来判断哪些节点与目标相关。实现方式包括基于规则的白名单机制（如只保留 form 及其子元素）、基于轻量模型的二分类器（判断节点是否可能与任务相关）、以及基于历史交互的动态剪枝（记录任务轨迹中实际被访问的节点路径）。实践表明，合理的选择性渲染能够在复杂页面上将 token 消耗降低 57% 以上，同时保持任务完成率基本不变。
Mozilla 于 2026 年初推出的 Tabstack 项目提供了选择性渲染的工程参考实现。该系统将 DOM 处理管线分解为多个阶段：首先进行基础的 HTML 解析和语义标注，随后根据任务类型选择性地提取内容子树，最后根据配置的 token 预算进行 Markdown 转换或进一步压缩。这种管线的设计使得选择性渲染可以与其他压缩技术（如 D2Snap）串联使用，形成多层过滤的协同效应。
增量更新：避免多步骤任务中的 token 累积
即使单次快照的 token 消耗得到有效控制，长时间运行的 AI 代理仍面临 token 累积的挑战。在包含数十个子步骤的多页面任务中，如果每一步都发送完整的 DOM 快照，上下文窗口将在任务执行中途被耗尽，导致代理 "遗忘" 早期步骤中建立的背景信息和操作上下文。这一问题在在线表单填写、多步骤结账流程、跨页面信息收集等场景中尤为突出。
增量更新机制的核心思想是在连续步骤之间只传递差异（diff）而非完整快照。实现这一机制需要维护一个稳定的 DOM 状态引用，并在每次页面变化时计算变更集。变更集可以包括节点的新增、删除、移动，以及文本内容、属性值的变化。AI 代理接收到的增量更新格式可以是结构化的差异描述，也可以是基于哈希索引的变更指示（如 "节点 X 的属性 Y 从 A 变为 B"）。这种方案的 token 消耗与实际变化的规模成正比，而非与页面整体规模成正比，因此能够有效控制多步骤任务的总开销。
状态管理是增量更新可靠性的关键保障。实践中需要处理多种挑战：动态内容生成（如 JavaScript 渲染的列表项）可能导致每次快照的结构都不相同；AJAX 加载和懒加载使得 "页面完整状态" 本身变得模糊；浏览器前进后退操作需要维护可回滚的历史快照。Surfly 团队提出的 "自愈 DOM 映射" 方案通过在向量数据库中维护页面状态快照集，并在每次加载时将当前 DOM 匹配到最近的已知状态，实现了稳定可靠的增量同步。这种方法特别适合需要频繁导航和返回的复杂任务场景。
Chrome 集成的 Gemini 模型提供了一种原生的增量更新思路。由于模型能够直接访问浏览器的实时 DOM 而无需序列化传输，理论上可以实现亚毫秒级的状态同步。但这种方案目前仍需与传统的快照方案配合使用 —— 对于需要保留长期记忆的高层决策，仍然需要生成语义化的摘要快照；对于高频的交互操作，则可以直接读取实时 DOM 状态。
工程落地：参数配置与监控指标
将上述技术应用于生产环境需要系统性的参数配置和持续监控。以下是可供参考的工程实践建议。
在 D2Snap 的参数初始化方面，对于以内容消费为主的页面（如博客、新闻网站），建议采用 k=0.4、l=0.5、m=0.6 的配置，能够将页面压缩至原始大小的 20% 至 30%，同时保留完整的内容层次结构。对于以交互为主的页面（如 SaaS 应用、电商详情页），建议采用更保守的 k=0.2、l=0.3、m=0.4 配置，以避免压缩掉关键的交互元素。对于需要极低 token 预算的场景（如 32K 上下文窗口的持续任务），可以启用 AdaptiveD2Snap 模式，通过 Halton 序列自动搜索最优参数组合，优先确保关键任务的完成度。
选择性渲染的策略配置应基于任务类型分类管理。对于信息检索类任务，仅保留页面可视区域和主内容区块；对于表单操作类任务，保留 form 元素及其所有子孙节点；对于多步骤流程类任务，结合增量更新机制维护任务相关的状态子图。建议为每种任务类型建立标准化的配置模板，并在任务执行过程中动态调整可见性阈值。
监控指标应覆盖压缩效果和任务质量两个维度。压缩效果指标包括：压缩率（压缩后 token 数 / 原始 token 数）、语义覆盖率（被保留的 UI 特征占原始 UI 特征的比例）、压缩耗时（从原始 DOM 到压缩快照的处理时间）。任务质量指标包括：任务成功率（代理成功完成目标的比例）、步骤效率（完成单步操作所需的平均交互次数）、token 效率（每单位任务价值的 token 消耗）。建议设置告警阈值：当压缩率低于预期 30% 或任务成功率下降超过 10% 时触发人工审查。
安全性考量同样不可忽视。AI 代理在浏览网页时可能面临恶意脚本、提示注入攻击等威胁。Smooth CLI 的设计理念是将浏览器作为沙箱隔离边界，代理不应直接接触认证凭据或敏感信息，浏览器的安全机制应当承担大部分的恶意行为防护责任。这种责任分离的架构设计对于企业级部署尤为重要。
技术演进方向
当前的 token 高效浏览器架构仍处于快速迭代阶段，多个技术方向值得持续关注。混合视觉 + DOM 的方案试图结合两者的优势 —— 使用压缩后的 DOM 快照提供结构化理解，同时在关键决策点辅以局部截图验证视觉细节。这种方案在视觉复杂度高的页面（如设计类网站、富媒体广告）上可能带来显著的效果提升。
自适应压缩策略的进一步发展将使浏览器能够根据具体页面特征和任务类型自动选择最优的处理管线。未来的系统可能具备在线学习能力 —— 通过分析代理在特定网站上的历史任务表现，自动调整压缩参数和渲染策略，逐步优化该网站的访问效率。
跨域内容的处理是另一个重要改进方向。由于安全策略的限制，嵌入的跨域 iframe 内容无法通过 DOM 快照捕获，这在某种程度上限制了压缩方案的适用范围。未来的解决方案可能需要结合服务端渲染或代理服务器协助，在保证安全性的前提下获取更完整的页面视图。
资料来源：Smooth CLI 在 Hacker News 的发布讨论（2026 年 2 月）提供了面向 AI 代理的浏览器设计理念参考；arXiv 论文《Beyond Pixels: Exploring DOM Downsampling for LLM-Based Web Agents》详细阐述了 D2Snap 算法的技术细节和评估结果。