AI Agent 网页地图实战:用 Web Speed 的共享 Sitemap 让浏览器 Agent 飞起来
痛点场景
想象一下:你让 Claude Code 去某个 SaaS 文档页找特定的 API 参数。Agent 打开页面,下载了 15 万字符的 HTML(含 JS、CSS、SVG、埋点脚本),然后花了几千 Token 去解析那些你根本不需要的 DOM 噪声,最后才找到那两行关键配置。如果一天要做 50 次这种操作,Token 浪费相当可观。
这就是 AI Agent 浏览网页时的经典信噪比问题——现代网页对人类友好,但对 AI 而言充满了无意义的噪声。Web Speed 正是解决这个问题的开源工具。
有无 Web Speed 对比
| 对比维度 | 裸 HTML 请求 | 用 Web Speed |
|---|---|---|
| Token 消耗 | 15-150K+ chars | 95% 以上压缩,仅保留结构 |
| 幻觉风险 | 高(LLM 常编造元素 ID) | 低(返回确定性的结构快照) |
| 响应速度 | 慢(全量 DOM 传输) | 快(结构化映射,即取即用) |
| 站点覆盖 | 每次需重复请求 | 支持全局缓存(共享 Sitemap) |
| 全站抓取 | 逐页手动 | 一键 site_map 爬取整个域名 |
Web Speed 是什么
Web Speed 是一个开源的 MCP 工具,专为 AI Agent 设计。它把所有非结构化的 HTML 页面转换成确定性、高效率的结构化地图——去掉脚本、样式、埋点等噪声,只保留标题、导航、链接、表单、表格、元数据等结构元素。最多能减少 97% 的 Token 消耗。
关键设计理念:工具本身不含任何 AI。没有 anthropic、没有 openai,所有解释工作交给调用它的 AI Agent。这意味着零额外推理成本、零供应商锁定。
安装
环境要求:Python 3.10+,MCP 兼容的客户端(Claude Desktop / Codex / Cline 等)。
git clone https://github.com/Dominic-Pi-Sunyer/web-speed-oss.git cd web-speed-oss/web-interpreter python3 -m venv venv source venv/bin/activate pip install -r requirements.txt
然后配置 MCP 客户端(以 Claude Desktop 为例),在 claude_desktop_config.json 中添加:
{
"mcpServers": {
"web-speed": {
"command": "/absolute/path/to/web-interpreter/venv/bin/python",
"args": ["/absolute/path/to/web-interpreter/server.py"]
}
}
}
重启客户端后,Web Speed 的 6 个 MCP 工具就会自动出现在工具列表中。
六大核心功能
Web Speed 提供 6 个 MCP 工具,覆盖了 AI Agent 浏览网页的几乎所有场景:
1. interpret_page — 页面结构解析
最核心的工具。给定一个 URL,返回完整的页面结构地图:标题、导航链接、内容链接、表单、表格、文本块、元数据。Agent 拿到这个结构就能做决策,而不需要啃原始 HTML。
2. site_map — 全站自动扫描
从根 URL 开始,递归爬取整个站点,返回一个合并的站点地图。对需要全面了解某个文档站或产品目录的场景特别有用。
3. submit_form — 表单提交
提交 GET 或 POST 表单并返回结果页的结构地图。适用于登录、搜索、分页等需要交互的场景。
4. inspect_element — 深层元素检查
当需要某个特定元素的详细数据时,用 CSS 选择器定位,返回该节点的深度结构信息。比全量解析高效得多。
5. page_type — 页面类型分类
立即返回页面类型:login、listing、article、form、navigation、other。Agent 可以根据类型决定下一步操作——如果是 login 就调表单提交,如果是 listing 就逐条处理。
6. invalidate_cache — 缓存管理
如果页面内容更新了,调用此工具清除缓存,下次请求会获取最新版本。
实战场景:构建一个产品信息查询 Agent
假设你需要让 AI Agent 从某个 SaaS 官网查找定价信息。用 Web Speed 的流程是这样的:
用户: "查一下 example.com 的 Pro 套餐价格"
Agent 流程:
1. interpret_page("https://example.com/pricing")
→ 返回结构化地图:标题、定价表格、FAQ 链接
2. Agent 直接从结构地图中读取定价行
→ "Pro: $29/月,包含 1000 API 调用/天"
3. 如果需要更多细节,用 inspect_element 定位 FAQ 区域
→ 整个过程不到 3 步,几百 Token
对比不用 Web Speed:
1. 下载 200KB HTML(大量 JS/CSS/埋点)
2. 用 prompt 让 LLM 理解原始 HTML
3. LLM 可能编造不存在的功能或价格
→ 5-10 步,几千 Token,还可能有幻觉
共享缓存:社区加速的新思路
Web Speed 还有一个独特设计——全局缓存。当用户 A 访问某个站点时,它生成的 Sitemap 会被上传到服务端缓存。之后其他用户访问同一站点时,可以直接从缓存获取,无需重新爬取。这是对 Token 效率的又一次提升——不仅单次请求快了,跨用户也快了。
横向对比
| 方案 | 适用场景 | Token 效率 | 学习成本 |
|---|---|---|---|
| 直接请求 HTML | 任何场景 | ❌ 极低 | ✅ 零 |
| Web Speed | AI Agent 自主浏览 | ✅ 极高(95%+ 压缩) | ✅ 低(MCP 一键配置) |
| Jina AI Reader | 内容提取 | ✅ 高 | ✅ 低(API 调用) |
| Firecrawl | 爬取 + 转换 | ✅ 高 | ❌ 中(需 API Key) |
Web Speed 的核心差异在于:它是完全本地运行的开源 MCP 工具,不需要任何 API Key,也不会将内容发送给第三方。
注意事项
- 免费版(开源版)只能访问本地缓存的 Sitemap;全局共享缓存需要付费 API
- 对于需要登录(Post-Auth)的页面,需要配合认证 cookies 使用
- 部分单页应用(SPA)的结构地图可能不如静态页面完整
- 工具本身不渲染 JavaScript,JS 动态生成的内容不会被捕获
- 遇到反爬措施时,注意设置合适的 User-Agent
总结
Web Speed 解决的是一个非常具体但高频的问题:AI Agent 读取网页时信噪比太低。通过将混乱的 HTML 转化为确定性的结构化地图,它不仅能节省大量 Token(95%+ 的压缩率),还能减少 LLM 因理解原始 DOM 而产生的幻觉。6 个 MCP 工具覆盖了从单页解析到全站扫描的完整场景,配置只需一行 MCP Server 注册。如果是高频使用 AI Agent 做网页分析的开发者,这个工具值得一试。
项目地址:https://github.com/Dominic-Pi-Sunyer/web-speed-oss HN 讨论:https://news.ycombinator.com/item?id=48441267