Native Extensions
Native interop extensions to GPUDevice and the WebGPU globals.
React Native WebGPU adds a handful of native extensions on top of the WebGPU spec.
importSharedTextureMemory
Imports a native buffer (IOSurface / AHardwareBuffer) for zero-copy sampling.
Native texture import requires "rnwebgpu/native-texture" in requiredFeatures.
const = await .({
: ["rnwebgpu/native-texture" as ],
});
// frame from createVideoPlayer(..., "bgra8") or Vision Camera
const = .({
: .,
: "camera-frame",
});
const = .();
.(, /* initialized */ true);
// sample texture in render pass…
.();
.();
.();Use beginAccess(texture, true) when the producer has already written pixels (typical for video/camera).
importSharedFence
Import native GPU sync fences for producer/consumer handoff:
// Producer side: export a fence after GPU work
const exported = sharedFence.export();
// Consumer side: import on another device or queue
const imported = device.importSharedFence({
handle: exported.handle,
label: "frame-ready",
});
// Wait for producer before sampling imported texture
imported.wait(0);
// … render using imported texture …
imported.signal(0);
imported.destroy();See packages/webgpu/src/__tests__/SharedFence.spec.ts for a full producer/consumer test.
dawnToggles
Non-standard Dawn device toggles at creation:
const = await .({
: {
: ["allow_unsafe_apis"],
: ["use_dxc"],
},
});Prop
Type
GPUExternalTexture extensions
| Field / Method | Description |
|---|---|
rotation | 0, 90, 180, or 270 degrees (camera orientation) |
mirrored | Horizontal flip for front camera |
destroy() | Release native surface access after the queue.submit() that sampled it |
Usage with importExternalTexture (NV12 camera/video):
const externalTexture = device.importExternalTexture({
source: nativeVideoFrame,
});
// Read orientation metadata in bind group / shader setup
console.log(externalTexture.rotation, externalTexture.mirrored);
// After submit that sampled the texture:
externalTexture.destroy();
nativeVideoFrame.release();createImageBitmap
createImageBitmap mirrors its Web counterpart and also accepts a Uint8Array or ArrayBuffer as input.
const = await ().(() => .());
const = await ();
..(
{ : },
{ },
{ : ., : . },
);
.();