web worker 无法直接传递 request 对象，因为它是非结构化数据且持有底层连接。正确做法是在主线程中通过 fetch() 发起请求获取响应数据（如 json），然后将解析后的纯数据通过 postmessage() 发送给 worker；worker 处理完毕后，再通过 postmessage() 将结果返回给主线程。
为什么 Request 不能直接传给 Worker
因为 Request 实例封装了 HTTP 连接状态和流式读取器，不属于可克隆对象（Structured Cloneable）。尝试将其序列化会抛出错误，必须先在主线程完成网络交互并提取数据。
const worker = new Worker('worker.js');
// 主线程：发起请求并发送数据
fetch('/api/data')
.then(res => res.json())
.then(data => {
// 只发送纯数据
worker.postMessage({ type: 'PROCESS', payload: data });
});
// 监听 Worker 返回
worker.onmessage = (e) => {
console.log('Worker result:', e.data);
};
Worker 内部如何处理数据
Worker 接收到消息后，在独立线程中执行计算或转换逻辑，避免阻塞主线程 UI。处理完成后，需再次调用 postMessage() 将结果发回主线程。
modern-javascript-patterns
下载
掌握 ES6+ 特性，包括 async/await、解构、扩展运算符、箭头函数、Promise、模块、迭代器、生成器以及函数式编程模式，编写简洁高效的 Java
立即学习“Java免费学习笔记（深入）”；
// worker.js
self.onmessage = function(e) {
const { type, payload } = e.data;
if (type === 'PROCESS') {
// 模拟耗时计算
const result = payload.map(item => item.value * 2);
// 发送结果回主线程
self.postMessage({ type: 'RESULT', data: result });
}
};
大数组传输的性能优化方案
当传递的数据量较大时，使用 Transferable Objects（可转移对象）可以零拷贝地移动内存所有权，显著提升性能。例如传递 ArrayBuffer 或 SharedArrayBuffer 时，源端内存将被清空，避免深拷贝开销。
