使用Performance面板录制并分析CPU活动可快速定位高耗时JS函数或循环：录制操作后查看主线程火焰图，识别宽高长条（单次耗时长）和密集小块（高频回调），通过Bottom-Up分析Self Time最高函数，结合Sources跳转和console.time验证，同时禁用扩展与缓存确保准确性。
直接用浏览器开发者工具的 Performance 面板录制并分析运行时的 CPU 活动，能快速定位耗资源的 JavaScript 函数或循环。
打开 Performance 面板并开始录制
在 Chrome 或 Edge 中按 F12 打开开发者工具 → 切换到 Performance 标签页 → 点击左上角的圆点按钮（●）开始录制 → 此时复现页面卡顿、动画掉帧或响应迟缓的操作（比如滚动、点击、加载数据）→ 操作完成后立即点击 Stop（■）停止录制。
查看主线程火焰图，识别高耗时任务
录制结束后，下方会显示时间轴和主线程（Main）的火焰图。重点关注：
- 宽而高的长条块：代表单次执行时间长的函数（如复杂计算、未优化的递归、同步 DOM 遍历）
- 密集连续的小块：可能是高频触发的回调（如 scroll、input 事件没节流，或 requestAnimationFrame 中做了重排重绘）
- 黄色/橙色占比高：说明 JavaScript 执行占主导；若灰色（Idle）少、红色（Rendering）多，可能问题在样式或布局，但 CPU 高通常对应 JS 占用异常
下钻分析具体函数调用栈
在火焰图中点击一个可疑的长任务块 → 右侧 Bottom-Up 或 Call Tree 标签页会列出该任务中各函数的耗时占比和调用路径：
deep-java-review
下载
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
立即学习“Java免费学习笔记（深入）”；
- 看 Self Time（自身耗时）最高的函数：它没被子函数占用的时间最多，往往是瓶颈所在
- 检查是否是
setTimeout/setInterval未清理、requestIdleCallback误用、或监听器重复绑定导致多次执行 - 注意匿名函数或箭头函数——它们在面板中可能显示为
<anonymous>，需结合源码位置（右侧显示文件名和行号）定位
配合 Sources 和 Console 进一步验证
在 Performance 面板中双击某函数名可跳转到 Sources 面板对应代码行；也可在可疑函数开头加 console.time('xxx') / console.timeEnd('xxx') 做轻量级验证；若怀疑是内存泄漏引发 GC 频繁拖慢 CPU，可切换到 Memory 面板录制堆快照比对。
不复杂但容易忽略的是：确保录制时禁用所有无关扩展，并在 Disable cache（Network 标签页右上角）勾选，避免缓存干扰真实执行表现。
