Chrome中Web Worker卡顿的典型表现是CPU飙升、任务延迟加剧及Worker被终止，主因是调度限制、内存约束与通信开销；应复用Worker、使用transferable、避免console.log、控制并发数并验证真实并行。
Chrome 中 Web Worker 卡顿的典型表现
不是主线程卡，而是多个 Web Worker 同时运行时，CPU 占用飙升、任务延迟加剧、甚至部分 Worker 被浏览器主动终止（Worker terminated. 错误）。这常发生在音视频解码、Canvas 渲染计算、或大量 JSON 解析等场景——你以为开了多线程就稳了，其实 Chrome 对 Worker 的调度和内存限制比想象中严格得多。
Web Worker 创建和通信的性能陷阱
频繁新建/销毁 Worker 比在单个 Worker 里做循环更耗资源；而用 postMessage() 传大对象（比如 Uint8Array 或嵌套深的 JSON）会触发结构化克隆，造成主线程阻塞和内存拷贝开销。
- 避免每帧都
new Worker()，复用已创建的 Worker 实例 - 传数组数据优先用
transferable：例如worker.postMessage(arrayBuffer, [arrayBuffer]); - 不要在 Worker 内频繁调用
console.log，尤其在循环中——它会同步回传主线程，形成隐式瓶颈 - Chrome 默认对每个 Worker 分配约 4MB 栈空间，递归过深或局部变量过大易触发
RangeError: Maximum call stack size exceeded
Chrome 多线程 HTML5 的真实并发上限
Chrome 并不按 CPU 核心数无限制启用 Worker。实际并发受三重限制：process per renderer（渲染进程级）、per-process worker limit（通常默认 20 个）、以及内存压力触发的自动降级。你在 DevTools 的 Performance 面板看到多个 Worker 时间线“挤在一起”，大概率是被调度器串行化执行了。
- 用
navigator.hardwareConcurrency获取逻辑核心数，但别直接按此数量创建 Worker——建议上限设为Math.min(4, navigator.hardwareConcurrency) - 开启
chrome://flags/#enable-web-worker-threads（仅 Chromium 115+）可提升 Worker 线程调度优先级，但需用户手动启用，不可依赖 - 若需更高吞吐，考虑
SharedArrayBuffer+Atomics实现零拷贝共享内存，但必须配合cross-origin-isolated环境（即服务端返回COOP/COEP头）
验证是否真正在多核上跑满
光看 top 或任务管理器里的 CPU 使用率没用——Chrome 渲染进程可能把所有 Worker 绑定在同一个内核上。真正要看的是 Chrome 的 chrome://tracing 记录，筛选 Worker 和 Thread 类型事件，观察不同 Worker thread N 是否有并行执行段。
网趣购物系统静态版支持网站一键静态生成，采用动态进度条模式生成静态，生成过程更加清晰明确，商品管理上增加淘宝数据包导入功能，与淘宝数据同步更新!采用领先的AJAX+XML相融技术，速度更快更高效！系统进行了大量的实用性更新，如优化核心算法、增加商品图片批量上传、谷歌地图浏览插入等，静态版独特的生成算法技术使静态生成过程可随意掌控，从而可以大大减轻服务器的负担，结合多种强大的SEO优化方式于一体，使
立即学习“前端免费学习笔记（深入）”；
const worker = new Worker('calc.js');
worker.postMessage({ type: 'start', data: hugeArray });
// 在 calc.js 中：
self.onmessage = function(e) {
if (e.data.type === 'start') {
const start = performance.now();
// 真实计算逻辑（避免 setTimeout / setInterval 干扰时间线）
const result = heavyComputation(e.data.data);
self.postMessage({ type: 'done', result, duration: performance.now() - start });
}
};注意：Chrome 120+ 对长时间运行的 Worker 会主动 throttle（尤其是后台标签页），performance.now() 在后台可能冻结，务必在前台验证。
最常被忽略的一点：多线程优化的前提是任务本身可分割且无强依赖。如果 8 个 Worker 都在等同一个 fetch() 返回，那线程再多也白搭——先检查数据流瓶颈，再动线程。
