Function renderNv12FrameWebGPU

apps/desktop/src/utils/webgpu-renderer.ts:409–544

(
	renderer: WebGPURenderer,
	data: Uint8ClampedArray,
	width: number,
	height: number,
	yStride: number,
	fullRange = false,
)

}

export function renderNv12FrameWebGPU(
	renderer: WebGPURenderer,
	data: Uint8ClampedArray,
	width: number,
	height: number,
	yStride: number,
	fullRange = false,
): WebGPURenderTiming {
	const totalStart = performance.now();
	let resizeMs = 0;
	let textureSetupMs = 0;
	let uploadMs = 0;
	let drawMs = 0;
	const {
		device,
		context,
		nv12Pipeline,
		nv12FullPipeline,
		sampler,
		nv12BindGroupLayout,
		canvas,
	} = renderer;

	if (canvas.width !== width || canvas.height !== height) {
		const start = performance.now();
		canvas.width = width;
		canvas.height = height;
		const format = navigator.gpu.getPreferredCanvasFormat();
		context.configure({
			device,
			format,
			alphaMode: "opaque",
		});
		resizeMs = performance.now() - start;
	}

	if (
		renderer.cachedNv12Width !== width ||
		renderer.cachedNv12Height !== height
	) {
		const start = performance.now();
		renderer.yTexture?.destroy();
		renderer.uvTexture?.destroy();

		renderer.yTexture = device.createTexture({
			size: { width, height },
			format: "r8unorm",
			usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST,
		});

		renderer.uvTexture = device.createTexture({
			size: { width: width / 2, height: height / 2 },
			format: "rg8unorm",
			usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST,
		});

		renderer.nv12BindGroup = device.createBindGroup({
			layout: nv12BindGroupLayout,