send()发送ArrayBuffer是高效传输二进制数据的核心方式，需通过TypedArray填充、传.buffer属性、服务端启用二进制帧并分片，接收端设binaryType='arraybuffer'以提升解析一致性。
直接用 send() 发送 ArrayBuffer 是高效传输二进制数据的核心方式，关键在于避免中间转换、确保底层字节原样送达，同时配合 WebSocket 的二进制帧机制减少协议开销。
发送前必须构造正确的 ArrayBuffer 或 TypedArray 实例
ArrayBuffer 本身不可直接读写，需通过 TypedArray（如 Uint8Array、Int32Array）或 DataView 填充数据。常见来源包括：
- 从
fetch().arrayBuffer()获取的远程资源 - Canvas 导出：
canvas.toBlob(blob => { ... }, 'image/png')后转为ArrayBuffer - WebAssembly 内存视图：
wasmInstance.exports.memory.buffer - 手动创建：
const buf = new ArrayBuffer(1024); const view = new Uint8Array(buf); view.set([0x48, 0x65, 0x6C, 0x6C, 0x6F]);
调用 send() 时传入 .buffer 属性而非 TypedArray 本体
WebSocket 的 send() 方法接受 ArrayBuffer、Blob 或字符串。若传入 Uint8Array 等 TypedArray 实例，部分浏览器（尤其是旧版 Safari 和某些 Android WebView）可能静默失败或报错。
务必使用其底层缓冲区：
- ✅ 正确：
ws.send(view.buffer)或ws.send(arrayBuffer) - ❌ 风险操作：
ws.send(view)（虽在 Chrome/Firefox 中常能工作，但不符合规范且兼容性不可靠）
服务端与网络层协同优化传输效率
仅前端正确发送还不够，需两端配合才能真正提升性能：
- 服务端应启用 WebSocket 的二进制帧支持（非 base64 编码文本帧），避免额外编码/解码耗时
- 对大块数据，考虑分片发送（如每 64KB 一帧），避免单帧过大触发浏览器内部限流或内存抖动
- 禁用 Nagle 算法（若服务端可控）：减少小包合并延迟，适合高频低延迟场景（如实时音视频控制信令）
- 确认 WebSocket 连接已建立且状态为
OPEN，避免send()被丢弃（可监听onopen事件后执行）
接收端建议设 binaryType 提升解析一致性
虽然发送端不依赖此设置，但接收端显式指定可避免类型歧义：
-
ws.binaryType = 'arraybuffer'→event.data直接是ArrayBuffer，无需再做response.arrayBuffer()类转换 - 搭配
new Uint8Array(event.data)即可快速访问字节，适合协议解析、图像帧处理等场景 - 注意：该属性在所有现代桌面/移动浏览器（Chrome 12+、Firefox 11+、Edge 79+、Safari 12.1+）中稳定支持
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
