--- title: 'Claude Code 三个浏览器 agent 工具速览:Playwright CLI、Firecrawl、Vercel' video_id: riPfkB5j7ok url: https://youtu.be/riPfkB5j7ok title_en: "Parallel AI Agent Browser Automation With Claude Code Is WILD" channel: All About AI published: 2026-03-30 duration: "17:25" topics: [Claude Code 工作流, MCP 与工具调用, AI 自动化] noted: 2026-07-05 value: A views: '4171' --- [![封面](https://i.ytimg.com/vi/riPfkB5j7ok/maxresdefault.jpg)](https://youtu.be/riPfkB5j7ok) > All About AI · 17:25 · 发布 2026-03-30 · 4171次观看(截至抓取) · [观看原视频](https://youtu.be/riPfkB5j7ok) ## 主旨 作者点评三个可搭配 Claude Code 使用的浏览器自动化工具——Playwright CLI、Firecrawl 的 interact 能力、Vercel 的 agent browser,并给出选型倾向。 ## 核心论点 1. **浏览器自动化首选 Playwright CLI,不要用 Playwright MCP**——CLI 更快、更省 token(约为 MCP 的两成)。([[#1-playwright-cli-而非-mcp-0010|→ 详解1]]) 2. **Firecrawl 的 interact 把浏览器自动化和网页抓取绑成一套组合拳**——适合既要操作页面又要采数据的场景。([[#2-firecrawl-的-interact-能力-0032|→ 详解2]]) 3. **Vercel agent browser 是更轻更快的 CLI 替代**——能力略弱于 Playwright CLI,但在不需要全部功能时更划算。([[#3-vercel-的-agent-browser-0055|→ 详解3]]) ## 知识点详解 > 说明:本片可用字幕只覆盖开头约 72 秒的三工具速览。标题所指的"Claude Code 并行浏览器自动化"实操演示未进入字幕,故以下详解仅还原这段工具选型口播。 ### 1. Playwright CLI 而非 MCP [00:10](https://youtu.be/riPfkB5j7ok?t=10) 作者把 Playwright CLI 列为第一名,并明确警告不要用 Playwright 的 MCP 形态。同一个底层工具,以 [[MCP]] 方式接入 Claude Code 和以 CLI 方式调用,体验被认为差距很大。 理由有二。一是速度,作者称 CLI "infinitely quicker";二是 token 成本,CLI 大约只用 MCP [20% 的 token](https://youtu.be/riPfkB5j7ok?t=17)。对长时间跑的 agent 来说,token 省下八成直接决定单次任务能不能负担。 它的定位是"最强但最重":免费、出自 Microsoft,适合想从终端跑多个 headless Chromium 实例的多路并行场景。若任务确实需要这种规模的浏览器编排,作者认为它是首选。 ### 2. Firecrawl 的 interact 能力 [00:32](https://youtu.be/riPfkB5j7ok?t=32) 第二名是 Firecrawl Interact,它是 Firecrawl agent 的一个子功能,而不是独立产品。它让你在 Firecrawl 里也能做各类浏览器自动化动作。 它的独特价值在"组合拳":把浏览器操作和网页抓取(scraping)接在同一条流程里。作者形容为 ["the perfect sort of one-two punch"](https://youtu.be/riPfkB5j7ok?t=53)——先自动化浏览、再顺手抓取数据,两步合一。 因此它的适用信号很明确:当你的自动化目标本身就带着采数据的需求时,用已经擅长抓取的 Firecrawl 一并解决,比单纯的浏览器 agent 更顺。 ### 3. Vercel 的 agent browser [00:55](https://youtu.be/riPfkB5j7ok?t=55) 第三名是 Vercel Agent Browser,同样是 CLI 工具。作者的定位是 Playwright CLI 的轻量替代:能力"a little less capable",但更精简、更快。 选型逻辑是按需取舍。如果你并不需要 Playwright CLI 那一整套多路 headless 编排能力,就没必要背上它的重量,换成更瘦的 Vercel agent browser 反而跑得利落。 ## 可执行步骤 - [ ] 若在 Claude Code 里做浏览器自动化,优先试 Playwright CLI,避免直接上 MCP 形态。 - [ ] 跑长任务前对比 CLI 与 MCP 的 token 消耗,验证"省八成"是否在自己的用例成立。 - [ ] 需求里同时含"操作页面 + 抓数据"时,评估 Firecrawl interact 的一体化流程。 - [ ] 只做轻量浏览动作、不需要多路并行时,拿 Vercel agent browser 做对照,看能否省掉 Playwright 的重量。 ## 术语 - Playwright CLI(Playwright 的命令行形态,与其 MCP 形态相对,作者主推) - Playwright MCP(以 Model Context Protocol 接入的 Playwright,作者明确不推荐) - headless Chromium(无界面运行的 Chromium 浏览器,用于自动化) - one-two punch(组合拳,指浏览器自动化与抓取两步接力) ## 金句 > "Do not use the Playright MCP. The CLI is infinitely quicker and more effective." → 对同一工具,接入形态(CLI vs MCP)带来的速度与成本差,可能比工具本身的选择更关键。 ## 立场与利益 频道 All About AI 是工具测评向的 YouTube 博主,视频本质是"top three"榜单口播,带明显的推荐导向。所列三者中,Playwright(Microsoft)与 Vercel agent browser 均为免费工具,Firecrawl 为商业产品;字幕段落未出现赞助或联盟声明,但榜单排名与"推荐去看"话术本身即是软性导流,采纳前宜自行验证而非照单全收。 ## 价值定位 - 适合谁:已在用 Claude Code、正为浏览器自动化选工具的人;想快速知道"该看哪三个"的入门筛选者。 - 解决什么:给出一份带倾向的三选一速览,并点出一个高价值经验——同工具的 CLI 形态往往比 MCP 形态更快更省 token。 - 认知 vs 实操:偏认知/选型信号。本片可用字幕仅到 72 秒的榜单口播,标题承诺的"并行浏览器自动化"实操未进字幕,故拿不到可复制的配置步骤,实操价值有限。 ## 自检问题 1. 作者为什么反对用 Playwright MCP、改推 Playwright CLI? **答案**:CLI 更快(infinitely quicker),且 token 用量约为 MCP 的 20%,长任务成本差距大。 [00:17](https://youtu.be/riPfkB5j7ok?t=17) 2. Firecrawl 的 interact 能力独特在哪,适合什么场景? **答案**:它是 Firecrawl agent 的子功能,把浏览器自动化与网页抓取合成一套组合拳,适合"操作页面 + 采数据"一体的需求。 [00:53](https://youtu.be/riPfkB5j7ok?t=53) 3. 什么情况下用 Vercel agent browser 而非 Playwright CLI? **答案**:当你不需要 Playwright CLI 全部的多路 headless 编排能力时——它能力略弱但更精简、更快。 [00:55](https://youtu.be/riPfkB5j7ok?t=55) > [!quote] 💬 热门评论 top-6 主 + 1 回(抓取 2026-07-07) > > [1] **@Kelz_v**:Playwright Clinton 这个工具看起来对编写浏览器测试挺有用的。 👍 1 > [3] **@hassanzarif9304**:有没有类似的东西可以在Flutter里用？ 👍 1 > [4] **@SuperEuro**:Chrome devtools MCP？ > [6] **@ProfessorG993**:“Cloud code”！？你是说Claude吧。看起来你用的那个转录AI把“Claude”误听成了“cloud”。我用Whisper的时候也经常遇到这种情况。 >   ↪ **@luccamgnt**:你可以用 --initial_prompt（或者类似的参数，用 'whisper --help' 就能看到）给Whisper一些关于转录内容的上下文，效果出奇地好，而且准确率也高。 > ——其他 2 条:感谢/夸赞([2]@stigub、[5]@tomdelong-j9f) >
英文原文[1] @Kelz_v:Playwright Clinton’s seems useful for writing browser testing 👍 1
[2] @stigub:Ehat about clauded native one?
[3] @hassanzarif9304:Is there something similar we can use with flutter 👍 1
[4] @SuperEuro:Chrome devtools MCP?
[5] @tomdelong-j9f:Efficient*
[6] @ProfessorG993:“Cloud code”!? You mean Claude. It looks like whatever transcript AI you’re using mistakes “Claude” for “cloud.” That happens all the time when I use Whisper.
  ↪ @luccamgnt:you can use --initial_prompt (or something like that, use 'whisper --help' and you'll see) to give Whisper some context about what is it transcribing, and it is surprisingly useful + accurate.