javascript / expert
Snippet
Verarbeitung binärer Datenströme mit reaktivem Uint8Array
Typisierte Uint8Array-Arrays arbeiten direkt auf rohem ArrayBuffer-Speicher. Die Verwendung von shallowRef verhindert, dass Vue versucht, tiefe Proxies auf hochperformanten binären Pufferstrukturen zu erstellen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
import { shallowRef } from 'vue';const bufferStream = shallowRef(new Uint8Array(0));export async function appendChunk(streamReader) {const { value, done } = await streamReader.read();if (done) return;const updated = new Uint8Array(bufferStream.value.length + value.length);updated.set(bufferStream.value, 0);updated.set(value, bufferStream.value.length);bufferStream.value = updated;}
vue
Erklärung
1
const bufferStream = shallowRef(new Uint8Array(0));
Speichert einen TypedArray-Datentyp mit shallowRef, um Objekt-Referenzänderungen ohne Proxy-Overhead zu verfolgen.
2
const { value, done } = await streamReader.read();
Wartet asynchron auf binäre Datenblöcke von einer ReadableStreamReader-Schnittstelle.
3
updated.set(bufferStream.value, 0);
Kopiert rohe Bytes aus dem vorherigen Uint8Array-Puffer in die neue binäre Pufferspeicher-Allokation.