Comlink 是轻量级库，让 Web Worker 调用如普通函数：自动处理消息传递、代理对象、Promise 回调和跨线程引用；支持复杂参数/返回值、错误自动还原、类型提示及 Tree Shaking。
Comlink 是一个轻量级库，能让 Web Worker 的使用像调用普通 JavaScript 函数一样自然，自动处理消息传递、代理对象、Promise 回调和跨线程引用。它把底层的 postMessage 和 onmessage 封装成直观的函数调用，避免手动序列化/反序列化和状态管理错误。
1. 基础 setup：主线程 + Worker + Comlink
先确保 Worker 文件是模块化的（ESM），并在主线程中用 new Worker(..., { type: 'module' }) 加载。
-
Worker 文件（worker.js）：导出要暴露给主线程的函数或对象，用
Comlink.expose()暴露接口 -
主线程：用
Comlink.wrap()包裹 Worker 实例，得到一个本地代理对象
示例：
// worker.js
import * as Comlink from 'comlink';
<p>function heavyCalc(n) {
let sum = 0;
for (let i = 0; i < n * 1e6; i++) sum += i;
return sum;
}</p><p>// 暴露整个对象（支持多个方法）
Comlink.expose({ heavyCalc }, self);// main.js
import * as Comlink from 'comlink';</p><p>const worker = new Worker('./worker.js', { type: 'module' });
const api = Comlink.wrap(worker);</p><p>// 调用就像本地函数，返回 Promise
api.heavyCalc(100).then(result => console.log(result));
2. 支持复杂参数与返回值（如 class、Promise、函数）
Comlink 自动代理函数、class 实例、Promise、ArrayBuffer、TypedArray 等可转移对象；对普通对象默认深拷贝（JSON-like），但可通过 Comlink.transfer() 显式移交 ArrayBuffer 或 MessagePort。
立即学习“Java免费学习笔记（深入）”；
- 传入函数：Worker 内可直接调用主线程传来的函数（Comlink 会自动代理）
- 返回 class 实例：主线程拿到的是代理对象，访问属性/方法会触发跨线程调用
- 避免循环引用：Comlink 不支持原生循环引用对象，需提前解构或用 transferable 替代
3. 错误处理与终止 Worker
Comlink 把 Worker 中抛出的错误自动序列化并还原为主线程的 Error 实例，可直接用 try/catch 或 .catch() 捕获。
- Worker 内
throw new Error('oops')→ 主线程api.xxx().catch(e => console.error(e.message)) - 主动终止 Worker：调用
worker.terminate()，后续调用会 reject 并报错 “Worker is dead” - 监听 Worker 异常：仍可监听
worker.onerror，但多数业务错误应走 Promise reject 流程
4. 进阶技巧：共享 Worker、类型提示、Tree Shaking
Comlink 支持 TypeScript 类型推导（配合 Comlink.Remote<T>），也兼容 SharedWorker（需用 Comlink.wrapShared()）。构建时注意：Comlink 默认支持 ESM，若用打包器（Vite/Webpack），确保未将 Comlink 打包进 Worker bundle（推荐通过 CDN 或 import 动态加载）以利于缓存和 Tree Shaking。
- Vite 用户可在
vite.config.js中配置build.rollupOptions.external: ['comlink']避免重复打包 - Worker 内 import 可用
import { expose } from 'comlink'（v4+ 推荐命名导入） - 避免在 Worker 中直接
console.log大对象——可能阻塞或序列化失败，改用console.debug(Comlink.proxyValue(obj))查看结构
