web workers 通过将纯计算任务移出主线程来防止页面卡顿，适用于大数组排序、图像处理等不操作 dom 的场景，但不可用于 dom 更新或依赖 window/document 的操作。
Web Workers 不让计算变快，但能让页面不卡——它把 CPU 密集型任务从主线程“搬走”，让渲染、响应点击、滚动这些事照常进行。
明确哪些任务适合丢给 Worker
不是所有耗时操作都该用 Worker。核心判断标准是：任务是否纯计算、不操作 DOM、不依赖 window 或 document。
- 适合的：大数组排序、图像像素处理（滤镜/缩放）、JSON 解析与结构转换、加密解密、斐波那契/素数筛等数学运算
- 不适合的：调用 fetch 后直接更新按钮文字、修改某个 div 的 class、读取 localStorage 并立刻写入 DOM —— 这些仍得在主线程做，Worker 做不了
- 注意：Worker 内不能用 console.log 过多（尤其开发时），容易拖慢自身线程；错误必须显式监听，否则静默失败
正确创建和加载 Worker 实例
本地双击 HTML 或用 file:// 打开会直接报错，必须走 HTTP 协议。路径写错、环境不匹配是新手最常卡住的地方。
- 开发阶段推荐用 npx http-server 或 VS Code 的 Live Server 插件起服务
- Vite / Webpack 等现代构建工具中，不要写 new Worker('./worker.js')，要用 new Worker(new URL('./worker.js', import.meta.url), { type: 'module' })
- 避免硬编码路径；如需动态逻辑（比如根据参数生成不同 worker），可用 Blob 构造：new Worker(URL.createObjectURL(new Blob([code], {type: 'application/javascript'})))
高效通信与数据传输
消息传递不是免费的。传大对象不优化，反而加重负担。
- 只传结构化克隆支持的类型：普通对象、数组、ArrayBuffer、TypedArray、Date、RegExp；函数、undefined、DOM 节点、ImageData 本身都不行
- 传 10MB 图像数据？别直接 postMessage(imgData)。应提取 imgData.data.buffer，用 postMessage(data, [data.buffer]) 移交所有权，避免内存翻倍
- 主线程监听必须写全：worker.onmessage = e => { /* 处理 e.data */ }；Worker 侧必须用 self.onmessage 或 self.addEventListener('message', ...)，self 是唯一全局对象
错误处理与生命周期管理
Worker 出错不会打断主线程，但也不会告诉你——除非你主动捕获。
- 主线程加 worker.onerror = e => console.error('Worker failed:', e.message)
- Worker 内部也建议包 try/catch，尤其在解析或计算前校验输入数据
- 任务结束及时关闭：Worker 内可调 self.close()；主线程可用 worker.terminate() 强制终止（适合超时或取消场景）
- 避免长期空跑：不设超时机制的无限循环 Worker 会持续占资源，影响浏览器整体性能
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
