Structured Clone 与 Transferable 对象跨线程数据传递优化实践

概述在前端多线程场景下，合理使用结构化克隆与可转移对象可以显著降低拷贝成本。本文给出能力检测与端到端示例。能力检测与示例const supportsSC = typeof structuredClone === 'function';

function cloneData(obj) {

if (supportsSC) return structuredClone(obj);

return JSON.parse(JSON.stringify(obj));

}

function sendBuffer(worker, buf) {

worker.postMessage({ type: 'data', payload: buf }, [buf.buffer]);

}

Worker 端接收与处理self.onmessage = e => {

if (e.data.type === 'data') {

const bytes = new Uint8Array(e.data.payload);

self.postMessage({ type: 'done', len: bytes.length });

}

};