UD5工具箱
什么是 structuredClone？
structuredClone() 是浏览器内置的深拷贝 API，能够克隆大多数结构化数据，包括 ArrayBuffer、Date、Map、Set、RegExp、循环引用等 JSON.stringify 无法处理的数据类型。它基于 HTML 结构化克隆算法，比 JSON 深拷贝更强大、更可靠。所有现代浏览器（Chrome 98+、Firefox 94+、Safari 15.4+）都已支持。本演示工具让你直观体验 structuredClone 的两种操作模式。
Transfer（转移）选项是什么？
structuredClone(obj, { transfer: [buffer] }) 中的 transfer 选项允许将可转移对象（如 ArrayBuffer）的所有权从原对象转移到克隆对象，而不是复制。转移后，原 buffer 的 byteLength 变为 0（被 neutered），实现零内存复制，极大提升大块二进制数据的克隆性能。本工具通过并排对比复制模式和转移模式，直观展示 Transfer 的效果和性能优势。
哪些对象可以被转移？
可转移对象包括：ArrayBuffer、MessagePort、ImageBitmap、OffscreenCanvas、ReadableStream、WritableStream、TransformStream、VideoFrame、AudioData 等。最常用的是 ArrayBuffer，在 Web Worker 通信、大文件处理、WebGL 纹理传输等场景中非常实用。其他可转移对象主要用于特定的 Web API 场景。
structuredClone vs JSON 深拷贝有什么区别？
structuredClone 支持 ArrayBuffer（可转移）、Date/Map/Set（完美支持）、循环引用（自动处理），性能极快（transfer 模式）。JSON 深拷贝会导致 ArrayBuffer 数据丢失、Date 变字符串、循环引用抛出错误、大 Buffer 性能极差。structuredClone 是现代 JavaScript 深拷贝的推荐方案，尤其在处理复杂数据结构和二进制数据时优势明显。
使用 transfer 后原对象会怎样？
转移后，原 ArrayBuffer 会被 neutered（去势），其 byteLength 变为 0，任何尝试读写该 buffer 的操作都会静默失败或返回 0。这是设计行为，确保同一时刻只有一份内存 ownership，避免数据竞争。在本工具的演示中，转移后原始对象的 buffer 状态会变为红色失效状态，byteLength 显示为 0。
什么场景适合使用 structuredClone + transfer？
典型场景包括：Web Worker 数据传输（主线程与 Worker 间传递大块数据）、大文件分片处理（避免内存翻倍）、WebGL 纹理上传、音视频帧处理（VideoFrame 转移）、实时数据流管道等。任何涉及大块二进制数据且只需保留一份的场景都适合使用 transfer。如果需要在两端都保留数据，应使用复制模式。
如何检测一个对象是否可转移？
可以使用简单的类型判断：obj instanceof ArrayBuffer 或 obj instanceof MessagePort 或 obj instanceof ImageBitmap。在实际使用中，只需将需要转移的对象引用放入 transfer 数组即可，引擎会自动处理。如果放入不可转移的对象，structuredClone 会抛出错误。本工具的内置知识卡片中详细列出了所有可转移对象类型及其在不同场景下的适用建议和详细的性能特征。