随着大型语言模型在 Web 自动化领域的应用日益广泛，如何高效地向 AI 代理传递页面状态成为了一个核心工程挑战。传统的截图方式虽然直观，但存在两个显著的痛点：其一是视觉处理带来的高计算成本，其二是无法直接生成精准的 CSS 选择器。相比之下，直接传递 DOM 快照（DOM Snapshot）具有更低的延迟和更强的可编程性 ——LLM 可以直接理解 HTML 结构并输出操作指令。然而，现代网页的 DOM 规模往往超出想象，一个复杂的单页应用可能包含数兆字节的 HTML 代码，折算成 Token 轻松超过 10 万个，远超模型的上下文窗口限制。
针对这一困境，本文提出并解析一种专为 AI 代理浏览器设计的DOM 差异化增量更新压缩算法（Differential DOM Compression with Incremental Updates）。该算法的核心思想并非简单地删除节点或提取交互元素，而是借鉴信号处理中的 ** 降采样（Downsampling）** 概念，在保留 UI 核心特征的前提下，对 DOM 树进行结构性的压缩与融合。通过这套机制，原始 DOM 可以被压缩至千级 Token（1e3 - 1e4），从而在不牺牲任务成功率的前提下，大幅降低 LLM 的上下文开销。
核心挑战：DOM 快照的规模与保真度矛盾
在深入算法细节之前，我们需要明确 DOM 快照在 AI 代理场景下的独特优势。DOM 是 Web 应用的运行时状态模型，它不仅包含了页面的所有信息，还保留了元素之间的层级关系（Hierarchy）。研究表明，这种层级关系对于 LLM 理解界面布局至关重要。此外，DOM 可以被序列化（Serialize）为 HTML，这与 LLM 预训练时的海量 Web 数据高度契合，使得模型具备天然的 HTML 解析能力。更重要的是，DOM 快照的获取时机早于完整的页面渲染（通常由 DOMContentLoaded 事件触发，而非 load 事件），这为需要快速响应的自动化流程节省了宝贵的时间。
然而，DOM 的体积是阻碍其应用的首要障碍。一个典型的新闻门户或电商详情页，其源代码大小往往在 500KB 到 2MB 之间。更糟糕的是，DOM 中包含了大量对 AI 代理毫无意义的 “噪音” 节点：样式脚本（style/script）、隐藏域、用于布局的空白 div、以及各种低价值的文本节点。如果直接将如此庞大的数据塞入 LLM 上下文，不仅会造成巨大的成本浪费，还可能导致模型在冗余信息中迷失，忽略真正关键的交互元素。
传统的降采样思路是元素提取（Element Extraction），即只保留 <button>、<input>、<a> 等交互标签。这种方法虽然能显著减少 Token 数量，但其代价是彻底丢失了 DOM 的层级结构。实验数据表明，保留层级结构的 D2Snap 降采样方案，其任务成功率（73%）显著高于纯元素提取方案（65%），这有力地证明了层级信息本身也是 LLM 理解界面的重要特征。
算法设计：D2Snap 三维降采样框架
D2Snap（Differential DOM Snapshot）算法的核心创新在于，它提出了一套 ** 结构保持（Structure-Preserving）** 的降采样框架。该框架通过三个相互独立的参数，分别控制对 DOM 元素、文本内容和属性的压缩力度，从而在压缩率和保真度之间取得平衡。
1. 元素降采样（Element Downsampling）：层级融合
DOM 本质上是一棵树，元素节点构成了树的枝干。D2Snap 首先根据元素的语义功能，将其划分为四类：容器（Container）、内容（Content）、交互（Interactive） 和 其他（Other）。容器元素（如 <div>、<section>、<main>）主要用于布局，其本身并不直接向用户传递信息；内容元素（如 <h1>、<p>、<span>）承载了页面的文字内容；交互元素（如 <button>、<a>、<input>）则是用户操作的入口。
D2Snap 的元素降采样策略对这三类元素区别对待：
- 交互元素：原样保留。一个按钮的位置、ID 和类名对于 LLM 判断其功能至关重要，必须完整保留。
- 内容元素：转化为 Markdown 语义标签。例如，一段加粗的文字
<b>Warning</b>会被简化为**Warning**。这种转换在语义上是等价的，但 Token 开销大幅降低，因为 HTML 标签往往比 Markdown 标记更冗长。 - 容器元素：基于深度（Depth）进行选择性合并。这是 D2Snap 最具创新性的步骤。算法引入了一个参数
k（范围 0 到 1），表示需要合并的层级比例。例如，如果 DOM 树的总高度为 10 层，且k = 0.4，则每隔 4 层（10 * 0.4 = 4）就进行一次父子合并。合并时，语义评分更高的元素作为 “目标节点”，评分较低的 “源节点” 被删除并替换为目标节点的孩子。这就像 JPEG 压缩中合并像素块一样，在保持视觉轮廓的同时大幅减少数据量。
2. 文本降采样（Text Downsampling）：语义浓缩
除了 HTML 标签，DOM 中的文本节点也是 Token 消耗的大户。一个产品详情页可能包含数百字的描述，但真正与当前任务相关的可能只有一句。D2Snap 使用 TextRank 算法对文本节点进行句子级别的摘要。TextRank 是一种基于词频统计的无监督关键词 / 关键句提取算法，它通过计算句子在文中的 “重要程度” 得分，筛选出最具代表性的句子。
算法引入参数 l（范围 0 到 1），表示需要删除的句子比例。例如，l = 0.3 意味着保留 70% 的核心句子，删除 30% 的边缘描述。这对于 AI 代理来说是极其有效的 —— 代理通常需要理解 “这个区域是做什么的”，而不需要阅读长篇大论的营销文案。
3. 属性降采样（Attribute Downsampling）：语义过滤
HTML 属性（Attributes）虽然数量众多，但大部分对于理解界面功能毫无帮助。例如，data-gtm-params 或 onclick 的长串哈希值对 LLM 毫无意义。D2Snap 利用预定义的语义评分表，对每个属性进行打分。评分较高的属性（如 id、class、aria-label、placeholder）被保留，因为它们能提供元素的标识或辅助功能信息；评分较低或为零的属性（如 style、data-tracking-id）则被直接删除。参数 m 控制了评分阈值，低于 m 的属性将被移除。
增量更新机制：Halton 序列与自适应降采样
在实际应用中，Web 页面的复杂度参差不齐。一个简单的登录页可能只有几百字节，而一个复杂的 WebGL 游戏页可能达到数兆字节。固定参数的 D2Snap 很难适应这种多样性。为此，论文提出了 Adaptive D2Snap（自适应 D2Snap），它利用 Halton 序列（Halton Sequence） 动态调整参数。
Halton 序列是一种低差异性序列，能够在多维空间中均匀地生成采样点。Adaptive D2Snap 将 (k, l, m) 视为一个三维空间，初始时使用较小的参数值（低压缩率），然后在每一次迭代中基于 Halton 序列生成新的参数组合，并重新运行 D2Snap。每次迭代后，如果 DOM 大小仍然超过目标 Token 限制，则提高压缩力度（增大 k, l, m 的基数）。
这种自适应的优势在于：
- 确定性：对于同一个 DOM，Adaptive D2Snap 总是能找到最优的参数组合，不会因为随机性导致结果不稳定。
- 高效性：它通常只需要几次迭代（论文中设置为 5 次）就能将 90% 以上的 DOM 压缩至目标大小以下。
- 灵活性：它可以适配不同的模型上下文窗口（8K, 32K, 128K），只需要在迭代中调整目标大小限制即可。
工程落地：监控指标与回滚策略
将 D2Snap 应用于生产环境的 AI 代理系统时，需要建立完善的监控和回滚机制。
关键监控指标（Metrics）
在部署 D2Snap 时，核心监控指标不是压缩率，而是任务成功率（Success Rate）和Token 消耗比（Token Cost Ratio）。建议在 Shadow Mode 下并行运行原始 DOM 和 D2Snap 快照，对比两者的 Agent 响应差异。如果 D2Snap 的成功率出现显著下降（如低于原始值的 95%），则需要回滚或调整参数。
回滚策略（Fallback Strategy）
当 Adaptive D2Snap 失败（如迭代次数耗尽仍未达标）或 LLM 返回错误（如上下文超限）时，系统应自动切换到最小兜底模式（Minimal Mode）。该模式下，算法仅保留交互元素（Interactive Elements）并移除所有非交互节点。这是最极端的压缩方式，虽然可能丢失层级信息，但至少能保证服务可用性。
上下文预算分配
建议将压缩后的 DOM Token 预算控制在 LLM 总上下文窗口的 30% 以下，预留足够的空间给系统提示词（System Prompt）、历史对话（Conversation History）和工具定义（Tool Definitions）。这能有效避免在长流程任务中出现上下文溢出。
结论
D2Snap 算法及其增量更新机制为 AI 代理浏览器提供了一个高效、可靠的 DOM 压缩方案。它不仅解决了 Token 消耗过大的燃眉之急，更重要的是，它揭示了 “层级结构（Hierarchy）” 和 “语义特征（Semantic Features）” 对于 AI 理解 Web 界面的关键作用。通过差异化的降采样策略，我们得以在海量信息和有限上下文之间找到平衡点，让 AI 代理能够像人类一样 “看清” 网页的结构，而不仅仅是盲目的点击。
资料来源：