codebuddy可精准定位前端与ssr性能瓶颈：静态扫描标出阻塞主线程、同步布局、大闭包等代码行；运行时模拟分析识别耗时超16ms的render及未清理useeffect；ssr追踪通过trace-summary.json定位high-blocking-io和large-serialized-payload具体模块路径与行号。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你需要快速定位前端页面加载慢、交互卡顿或服务端首屏渲染延迟的具体代码位置，而不是靠经验猜、靠日志翻、靠反复加 console 手动排查。CodeBuddy 能直接从源码和运行上下文中识别出阻塞主线程的同步操作、未优化的虚拟 DOM diff、重复数据获取、大体积序列化等真实瓶颈点，并精准标出文件路径与行号。
静态代码层性能扫描
适用于开发阶段早期介入，无需运行项目，打开即扫，适合排查潜在的、尚未暴露的性能隐患。
第一步：在 VS Code 或 WebStorm 中打开前端项目，确认已安装 CodeBuddy 插件且项目根目录存在 【CODEBUDDY.md】 文件——这是插件识别技术栈和上下文的关键凭证，缺失会导致 React/Vue 组件生命周期分析失效。
第二步：右键点击任意 .js/.tsx/.vue 文件 → 选择「Analyze Performance Bottleneck」菜单项。
第三步：等待扫描完成（通常 3～8 秒），CodeBuddy 将高亮标注三类关键问题：未用 requestIdleCallback 包裹非紧急任务、强制同步布局（如读取 offsetTop 后立即修改 className）、重复创建大型闭包对象（例如在 render 中定义含大量计算的箭头函数）。这些标记直接叠加在编辑器代码行上，点击即可跳转。
运行时行为模拟分析
不依赖真实浏览器，专为复现“滚动卡顿”“点击无响应”这类难以稳定触发的交互瓶颈而设计。
方法一：定义模拟场景
在项目根目录新建 performance-test.mock.json，内容必须包含 type（如 "scroll"）、trigger（如 "window.scrollTo(0, 500)"）、duration（毫秒）三项，缺一不可，否则沙箱无法推演耗时分布。
方法二：执行模拟指令
CodeBuddy Code CLI 的安装、配置与使用指南。CodeBuddy Code 是腾讯推出的 AI 驱动 CLI 编程助手，支持自然语言驱动开发。 - 必备触发词：CodeBuddy, codebuddy, AI CLI, Tencent AI coding, @tencent-ai/codebuddy-code, terminal AI assistant - 适用场景：安装 CodeBuddy CLI、配置 CodeBuddy、使用 CodeBuddy 命令、排查 CodeBuddy 问题
终端运行：codebuddy run --mode=runtime --input=performance-test.mock.json
方法三：解读报告重点
查看输出中 render commit 阶段耗时超过 16ms 的组件名，以及标记为 【uncleaned useEffect】 的副作用函数——后者往往导致内存泄漏并拖慢后续渲染，必须优先处理。
SSR 渲染瓶颈追踪
当你发现 Next.js 或 SvelteKit 应用 TTFB 高于 800ms，且服务端 CPU 持续 90% 以上，说明问题大概率出在服务端渲染链路内部。
1. 在项目根目录执行：codebuddy analyze --ssr-trace
2. 新开终端，向本地 SSR 端点发起一次请求：curl http://localhost:3000/
3. 扫描自动结束，生成 trace-summary.json 文件，其中 high-blocking-io 字段指向的模块就是同步阻塞源头，比如一个未加 timeout 的 fetch 调用；large-serialized-payload 字段则对应 JSON.stringify() 输出体积超 200KB 的数据结构，这会显著拖慢 Node.js 序列化速度。
4. 直接打开该文件路径，在对应行添加 abortSignal 或拆分数据结构，修改后重新运行 trace 即可验证耗时下降。
