企业官网建设流程全解析

Midscene.js 提速指南：4 个实用优化让 AI 浏览器自动化脚本跑得更快

【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene

Midscene.js 用自然语言驱动浏览器：AI 看截图、读屏幕、替你点击和输入。跑长脚本时，经常遇到响应慢、中途卡住、内存越跑越高的问题。这篇文章讲 4 个能直接落地的 Midscene.js 性能优化，从压缩截图开销到开启任务结果缓存，帮你解决自动化脚本卡顿。

先搞懂任务是怎么跑的

一条指令的执行是个固定循环：截一张图 → 把图交给多模态模型"看懂"页面上有什么 → 模型返回下一步动作 → 代码执行它 → 再截图。时间基本都花在"截图 + 一次 AI 请求"上，步数则由指令复杂程度决定。

所以提速只有两条路：减少步数，或者让每一步更快。后文都围绕这两点展开。

三种典型瓶颈的成因

遇到哪种现象，就对号入座做下面的优化，不用全都做。

分步实施优化

第 1 步：把截图变小

问题表现：每一步都偏慢，高分辨率屏幕上尤其明显。

做法：Midscene.js 在把截图发给模型前会先转成 JPEG 并压缩（处理链路见 screenshot-preparation.ts）。如果业务页面不需要超大窗口，先把浏览器视口尺寸调小，图小了，上传和模型推理都会变快。

// 建上下文时把视口设成适中尺寸 const context = await browser.newContext({ viewport: { width: 1280, height: 800 }, });

预期效果：单步耗时下降，步数多时累计省下的时间很可观。

第 2 步：按任务难度选模型

问题表现：所有步骤都慢，连"确认页面有某个按钮"这种简单判断也要等很久。

做法：简单任务（取值、点按钮）交给快而轻的模型，复杂的多步推理再用更强的模型。模型通过环境变量指定，不同脚本可以用不同配置，改配置不改代码。

# 跑复杂任务时换更强的视觉模型 export MIDSCENE_MODEL_NAME=qwen-vl-max

预期效果：轻量任务响应更快，整体节奏更稳，不用为大任务支付全部成本。

第 3 步：开启任务结果缓存

问题表现：同一套用例反复跑（CI、回归），很多步骤结果根本不会变，却每次都请求 AI。

做法：给脚本配一个固定的缓存 ID，命中缓存的步骤直接复用上次结果，跳过模型请求。缓存机制实现见 task-cache.ts，用法参考 caching 文档。

const agent = new MidsceneAgent(page, { cache: { id: 'shop-home-check' }, });

预期效果：重复运行时，命中缓存的步骤从几秒降到毫秒级，回归套件整体提速最明显。

第 4 步：长列表分批，控制并发

问题表现：任务跑得越久越卡，Node 进程内存曲线一路向上。

做法：让 AI 一次只查一小批数据（比如 50 条），处理完再查下一批，别把整个数据集塞进一次请求；并发调用也控制在个位数，避免同时涌出太多 AI 请求把连接和内存都吃满。

// 每批 50 条，处理完再取下一批 for (let i = 0; i < items.length; i += 50) { await processBatch(items.slice(i, i + 50)); }

预期效果：内存保持平稳，长时间任务不再越跑越慢。

效果怎么验证

测量方法很简单：Midscene.js 报告会记录每个任务的 total time 和各步耗时，对比两版报告即可；内存可以用系统监控或process.memoryUsage()定时打印 Node 进程峰值。步数方面，对比优化前后报告里的任务列表条数就能看出是否减少了无效步骤。

常见疑问 FAQ

AI 请求偶尔超时，该先查什么？先确认网络和模型接口：Base URL 和 API Key 是否可达、模型服务是否在线。网络没问题后再考虑给个别步骤加重试，而不是全局盲目重试。

开了缓存，结果会不会"过期"？缓存按 ID 和步骤内容匹配。页面或指令变化后对应步骤不再命中，会照常请求模型，不会用到旧结果。

内存高是不是直接加内存就行？先按第 4 步确认数据是否分批、并发是否过高。这两项都优化后仍然高，再考虑加内存或拆分用例。

换轻量模型后需要改脚本吗？一般只改环境变量里的模型名即可。如果轻量模型对复杂指令理解力不够，可以把大指令拆成更明确的短句。

写在最后

优化顺序建议是：先砍截图开销、再开缓存，最后按监控结果决定是否调模型和并发。改动一次只做一个变量，用报告里的 total time 对比，效果一目了然。

进一步阅读：caching 缓存文档、model-config 模型配置文档、核心 Agent 源码。

【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene