WebGPU 개발자 기능

François Beaufort
François Beaufort
GitHub

게시일: 2025년 6월 3일

Chrome의 WebGPU API 구현에는 개발 및 테스트 전용 기능이 포함되어 있습니다. 이러한 기능은 표준 WebGPU 사양 외부에 있습니다. 프로덕션에서는 이러한 기능을 사용하지 마세요.

이 문서에서는 WebGPU 개발자 기능을 사용 설정하는 방법을 자세히 설명하고 포괄적인 목록을 제공합니다.

기본 요건

Chrome에서 WebGPU 개발자 기능을 사용 설정하려면 다음 단계를 따르세요.

  1. chrome://flags/#enable-webgpu-developer-features에서 'WebGPU 개발자 기능' 플래그를 사용 설정합니다.
  2. Chrome 브라우저를 다시 시작합니다.

타임스탬프 쿼리 양자화 사용 중지

타임스탬프 쿼리를 사용하면 WebGPU 애플리케이션이 컴퓨팅 및 렌더링 패스 중에 GPU 명령의 실행 시간을 나노초 단위로 정확하게 측정할 수 있습니다. 이러한 쿼리는 GPU 워크로드 성능과 동작을 분석하는 데 필수적입니다. 자세한 내용은 컴퓨트 및 렌더링 패스의 타임스탬프 쿼리를 참고하세요.

타이밍 공격 우려로 인해 타임스탬프 쿼리는 100마이크로초의 해상도로 양자화되어 정밀도와 보안 간에 적절한 절충안을 제공합니다. 이 양자화는 'WebGPU 개발자 기능' 플래그가 사용 설정되면 자동으로 사용 중지됩니다.

확장된 어댑터 정보

사용 중인 어댑터를 자세히 알아보려면 GPUAdapterInfo가 다음 속성을 노출합니다.

  • device 속성 (표준화됨)은 공급업체별 어댑터 식별자입니다.
  • description 속성 (표준화됨)은 어댑터 세부정보를 제공하는 사람이 읽을 수 있는 문자열입니다.
  • driver 속성 (표준화되지 않음)은 드라이버를 설명하는 사람이 읽을 수 있는 문자열입니다.
  • backend 속성 (표준화되지 않음)은 "WebGPU", "D3D11", "D3D12", "metal", "vulkan", "openGL", "openGLES", "null"과 같은 그래픽 백엔드를 나타냅니다.
  • type 속성(비표준화됨)은 GPU 유형("discrete GPU", "integrated GPU", "CPU" 또는 "unknown")을 식별합니다.
  • d3dShaderModel 속성 (표준화되지 않음)은 지원되는 최대 D3D 셰이더 모델 번호를 지정합니다. 예를 들어 62는 HLSL SM 6.2 지원을 나타냅니다.
  • vkDriverVersion 속성 (표준화되지 않음)은 공급업체 지정 Vulkan 드라이버 버전입니다.
  • powerPreference 속성 (표준화되지 않음)은 GPURequestAdapterOptions의 GPUPowerPreference에 따라 "low-power" 또는 "high-performance"입니다.

앱 개발 중에 많은 양을 할당할 때 메모리 제한을 예상하기 위해 GPUAdapterInfo는 어댑터에서 사용할 수 있는 메모리 힙의 크기 및 유형과 같은 비표준화된 memoryHeaps 정보를 노출합니다.

const adapter = await navigator.gpu.requestAdapter();

for (const { size, properties } of adapter.info.memoryHeaps) {
  console.log(size); // memory heap size in bytes
  if (properties & GPUHeapProperty.DEVICE_LOCAL)  { /* ... */ }
  if (properties & GPUHeapProperty.HOST_VISIBLE)  { /* ... */ }
  if (properties & GPUHeapProperty.HOST_COHERENT) { /* ... */ }
  if (properties & GPUHeapProperty.HOST_UNCACHED) { /* ... */ }
  if (properties & GPUHeapProperty.HOST_CACHED)   { /* ... */ }
}

셰이더 모듈 컴파일 옵션 엄격한 수학

GPUShaderModuleDescriptor에는 strictMath 비표준 불리언 옵션이 포함되어 있으며, 이 옵션은 셰이더 모듈 컴파일 중에 엄격한 수학적 정밀도를 사용 설정하거나 사용 중지합니다. 이 옵션은 Metal 및 Direct3D에서 지원됩니다. strictMath이 사용 설정되면 컴파일러는 정확한 수학 규칙을 준수합니다. 반대로 사용 중지하면 컴파일러가 다음을 통해 셰이더를 최적화할 수 있습니다.

  • NaN 및 Infinity 값의 가능성을 무시합니다.
  • -0을 +0으로 처리합니다.
  • 나누기를 역수를 곱하는 더 빠른 곱셈으로 대체
  • 결합 법칙과 분배 법칙에 따라 작업을 재정렬합니다.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const code = `
  // Examines the bit pattern of the floating-point number to
  // determine if it represents a NaN according to the IEEE 754 standard.
  fn isNan(x : f32) -> bool {
    bool ones_exp = (bitcast<u32>(x) & 0x7f8) == 0x7f8;
    bool non_zero_sig = (bitcast<u32>(x) & 0x7ffff) != 0;
    return ones_exp && non_zero_sig;
  }
  // ...
`;

// Enable strict math during shader compilation.
const shaderModule = device.createShaderModule({ code, strictMath: true });

제로 카피로 동영상 가져오기

GPUExternalTexture isZeroCopy 비표준화된 불리언 속성을 사용하면 importExternalTexture()로 가져온 동영상이 중간 복사본 없이 GPU에 직접 액세스되었는지 알 수 있습니다.

const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const video = document.querySelector('video');
const externalTexture = device.importExternalTexture({ source: video });

if (externalTexture.isZeroCopy) {
  console.log('Video frame was accessed directly by the GPU');
}