用途:当 Web 应用感觉卡顿、迟缓或无响应时,用此技能对运行中的应用做 CPU 性能剖析,捕获真实调用栈与时间数据,定位耗时函数并给出优化建议。
主要能力:cursor-ide-browser MCP 提供 browser_profile_start 与 browser_profile_stop 工具,可捕获 Chrome DevTools 格式的 CPU 剖析数据,输出到 ~/.cursor/browser-logs/,包含原始 JSON 和可读的 summary.md。分析时可关注 profile.nodes[].hitCount、profile.nodes[].callFrame.functionName、profile.samples.length;结合摘要识别最耗 CPU 的函数、意外重渲染或布局抖动、昂贵的第三方库调用、阻塞主线程的同步操作。
使用方式:先确保应用运行(必要时启动 dev server);用 browser_navigate 打开慢页面(如 http://localhost:3000/slow-page);调用 browser_profile_start 开始;用 browser_click、browser_scroll、browser_fill 等复现慢交互并等待数秒;调用 browser_profile_stop 停止并生成文件;读取原始 JSON 与摘要进行分析,再依据数据建议修复,例如缓存昂贵计算、对事件处理去抖、把重活移到 Web Worker、懒加载组件或路由、虚拟化长列表。
限制与注意:摘要可能遗漏细节,应读取原始 JSON 交叉验证;开发模式剖析会受 React 开发开销影响,精确测量应剖析生产构建;短剖析(2–5 秒交互)通常比长时间更有用;建议对比优化前后的剖析结果以确认效果。