JS性能调优需建立“问题定位→指标验证→原理归因→验证修复”闭环，聚焦运行时机制：用Performance面板抓长任务与强制同步布局，Heap Snapshot查Detached DOM和闭包泄漏，console.time与Profiler实测验证，并回归V8隐藏类、事件循环、渲染管线等原理归因。
JS 运行时性能调优不是堆砌技巧，而是建立“问题定位 → 指标验证 → 原理归因 → 验证修复”的闭环。关键不在工具多，而在每一步都落到运行时机制上——比如看到卡顿，要能判断是 V8 的隐藏类失效、事件循环被长任务阻塞，还是渲染管线里强制同步布局（FSL）在反复触发。
抓准瓶颈：用 Performance 面板锁定主线程杀手
打开 Chrome DevTools → Performance → 勾选 Memory 和 Screenshots → 录制典型用户操作（如列表滚动、Tab 切换、表单提交）→ 停止。
- 重点盯红色长条（Long Tasks >50ms）：点开看 Call Stack，确认是 JS 执行耗时、Layout 阻塞，还是 GC 暂停；
- 留意 Layout / Recalculate Style 高频出现：说明代码中存在强制同步布局，比如在 for 循环里反复读 offsetHeight 再改 style.left；
- 观察 FPS 曲线是否持续跌破 60fps：配合 Summary 面板查原因——JS 执行过久？Paint 耗时突增？还是 Composite 阶段延迟？
揪出泄漏：Heap Snapshot 对比 Detached DOM 与 Closure
Memory 面板 → Heap Snapshot → 拍摄快照 1 → 执行疑似泄漏动作（如打开/关闭弹窗、切换路由）→ 拍摄快照 2 → 切 Comparison 视图。
jm-jsjkxyjs02-zlm-405
下载
使用约定式提交（Conventional Commits）生成标准化的 Git 提交信息。适用于以下场景： (1) 暂存更改时需要提交信息； (2) 审查 diff 时希望获得结构化摘要； (3) 编写 PR 描述或变更日志（changelog）条目； (4) 用户明确要求“为本次更改编写提交信息”。 该功能会分析已暂存/未暂存的 diff，并生成按类型（type）划分范围的提交信息。
- 筛选 Detached DOM tree：数量持续增长，大概率是事件监听器未解绑，或闭包持有已移除的父节点；
- 按 Constructor 排序，重点关注 Closure、Array、Object 中非预期增长的实例数；
- 双击可疑构造函数 → 右侧 Retainers 查引用链，快速定位谁在“拽着”不该留的对象不放。
验证执行效率：console.time + Profiler + 代码标注三连
别靠感觉猜哪段慢，用实测数据说话：
- 用 console.time('init') / console.timeEnd('init') 包裹初始化、渲染、数据处理等关键路径；
- 在长循环里加条件日志，例如 if (i % 1000 === 0) console.log(`processed ${i}`)，观察是否卡在某次迭代；
- 启用 Legacy JavaScript Profiler 录制调用栈，识别高频小函数——比如重复 new Date()、隐式 toString()、或每次调用都创建新对象。
回归原理归因：把现象翻译成引擎行为
性能问题必须落到 JS 运行时机制上解释，否则优化只是临时止痛：
- 看到大量 Layout？→ 不是“DOM 操作多”，而是违背了“读写分离”原则，在微任务中连续读 offsetTop 又改 class；
- 内存持续上涨但 GC 不回收？→ 不单是“忘了 removeEventListener”，要查 V8 的 Scavenge 是否因闭包长期持有大数组而失效；
- 函数执行变慢且 Profile 显示内联失败？→ 检查是否动态增删属性破坏了隐藏类，或参数类型不稳定触发去优化（deoptimization）。
