WGSL의 클립 거리
클립 거리를 사용하면 정점 단계의 출력에서 사용자 정의 절반 공간으로 원시 객체의 클립 볼륨을 제한할 수 있습니다. 자체 클리핑 평면을 정의하면 WebGPU 장면에서 표시되는 항목을 더 세부적으로 제어할 수 있습니다. 이 기법은 시각화를 정확하게 제어하는 것이 중요한 CAD 소프트웨어와 같은 애플리케이션에 특히 유용합니다.
GPUAdapter에서 "clip-distances"
기능을 사용할 수 있는 경우 이 기능이 있는 GPUDevice를 요청하여 WGSL에서 클립 거리 지원을 가져오고 enable clip_distances;
를 사용하여 WGSL 코드에서 이 확장 프로그램을 명시적으로 사용 설정합니다. 사용 설정하면 정점 셰이더에서 clip_distances
내장 배열을 사용할 수 있습니다. 이 배열은 사용자 정의 클립 영역까지의 거리를 유지합니다.
- 클립 거리가 0이면 정점이 평면에 있음을 의미합니다.
- 거리가 양수이면 정점이 클립 절반 공간 (유지하려는 측면) 내에 있음을 의미합니다.
- 거리가 음수이면 정점이 클립 절반 공간 (삭제하려는 면) 외부에 있음을 의미합니다.
다음 스니펫, chromestatus 항목, 문제 358408571을 참고하세요.
const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("clip-distances")) {
throw new Error("Clip distances support is not available");
}
// Explicitly request clip distances support.
const device = await adapter.requestDevice({
requiredFeatures: ["clip-distances"],
});
const vertexShaderModule = device.createShaderModule({ code: `
enable clip_distances;
struct VertexOut {
@builtin(clip_distances) my_clip_distances : array<f32, 1>,
@builtin(position) my_position : vec4f,
}
@vertex fn main() -> VertexOut {
var output : VertexOut;
output.my_clip_distances[0] = 1;
output.my_position = vec4f(0, 0, 0, 1);
return output;
}
`,
});
// Send the appropriate commands to the GPU...
GPUCanvasContext getConfiguration()
GPUCanvasContext configure()
가 구성 사전으로 호출되면 GPUCanvasContext getConfiguration()
메서드를 사용하여 캔버스 컨텍스트 구성을 확인할 수 있습니다. device
, format
, usage
, viewFormats
, colorSpace
, toneMapping
, alphaMode
멤버가 포함되어 있습니다. 이는 입자 (HDR) 샘플과 같이 브라우저에서 HDR 캔버스를 지원하는지 확인하는 등의 작업에 유용합니다. 다음 스니펫, chromestatus 항목, 문제 370109829를 참고하세요.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();
const canvas = document.querySelector("canvas");
const context = canvas.getContext("webgpu");
// Configure the canvas for HDR.
context.configure({
device,
format: "rgba16float",
toneMapping: { mode: "extended" },
});
const configuration = context.getConfiguration();
if (configuration.toneMapping.mode === "extended") {
// The browser supports HDR canvas.
// Warning! The user still needs a HDR display to enjoy HDR content.
}
점 및 선 원시에는 깊이 바이어스가 없어야 합니다.
앞서 발표된 것처럼 이제 WebGPU 사양에서 렌더링 파이프라인의 토폴로지가 선 또는 포인트 유형인 경우 depthBias
, depthBiasSlopeScale
, depthBiasClamp
를 0이 아닌 값으로 설정하면 유효성 검사 오류가 발생합니다. 문제 352567424를 참고하세요.
하위 그룹을 위한 포괄적 스캔 내장 함수
하위 그룹 실험의 일환으로 문제 361330160에서 다음 하위 그룹 기본 제공 함수가 추가되었습니다.
subgroupInclusiveAdd(value)
: 하위 그룹의 모든 활성 호출value
의 포괄적 스캔 합계를 반환합니다.subgroupInclusiveMul(value)
: 하위 그룹 전체에서 모든 활성 호출value
의 스캔 곱셈값을 반환합니다.
다중 그리기 간접에 관한 실험적 지원
다중 그리기 간접 GPU 기능을 사용하면 단일 GPU 명령어로 여러 그리기 호출을 실행할 수 있습니다. 이는 특히 파티클 시스템, 인스턴스화, 대규모 장면과 같이 많은 수의 객체를 렌더링해야 하는 경우에 유용합니다. drawIndirect()
및 drawIndexedIndirect()
GPURenderPassEncoder 메서드는 GPU 버퍼의 특정 영역에서 한 번에 그리기 호출 하나만 실행할 수 있습니다.
이 실험용 기능이 표준화될 때까지 chrome://flags/#enable-unsafe-webgpu
에서 '안전하지 않은 WebGPU 지원' 플래그를 사용 설정하여 Chrome에서 사용할 수 있도록 합니다.
GPUAdapter에서 사용할 수 있는 "chromium-experimental-multi-draw-indirect"
비표준 GPU 기능을 사용하여 이 기능이 있는 GPUDevice를 요청합니다. 그런 다음 GPUBufferUsage.INDIRECT
사용으로 GPUBuffer를 만들어 그리기 호출을 저장합니다. 나중에 새 multiDrawIndirect()
및 multiDrawIndexedIndirect()
GPURenderPassEncoder 메서드에서 이를 사용하여 렌더링 패스 내에서 그리기 호출을 실행할 수 있습니다. 다음 스니펫과 문제 356461286을 참고하세요.
const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("chromium-experimental-multi-draw-indirect")) {
throw new Error("Experimental multi-draw indirect support is not available");
}
// Explicitly request experimental multi-draw indirect support.
const device = await adapter.requestDevice({
requiredFeatures: ["chromium-experimental-multi-draw-indirect"],
});
// Draw call have vertexCount, instanceCount, firstVertex, and firstInstance parameters.
const drawData = new Uint32Array([
3, 1, 0, 0, // First draw call
3, 1, 3, 0, // Second draw call
]);
// Create a buffer to store the draw calls.
const drawBuffer = device.createBuffer({
size: drawData.byteLength,
usage: GPUBufferUsage.INDIRECT | GPUBufferUsage.COPY_DST,
});
device.queue.writeBuffer(drawBuffer, 0, drawData);
// Create a render pipeline, a vertex buffer, and a render pass encoder...
// Inside a render pass, issue the draw calls.
myPassEncoder.setPipeline(myPipeline);
myPassEncoder.setVertexBuffer(0, myVertexBuffer);
myPassEncoder.multiDrawIndirect(drawBuffer, /*offset=*/ 0, /*maxDrawCount=*/ 2);
myPassEncoder.end();
셰이더 모듈 컴파일 옵션 엄격한 수학
GPUShaderModuleDescriptor에 불리언 strictMath
개발자 옵션이 추가되어 셰이더 모듈 컴파일 중에 엄격한 수학을 사용 설정하거나 사용 중지할 수 있습니다. 이 기능은 chrome://flags/#enable-webgpu-developer-features
의 'WebGPU 개발자 기능' 플래그 뒤에서 사용할 수 있습니다. 즉, 개발 중에만 사용하도록 설계된 기능입니다. 문제 42241455를 참고하세요.
이 옵션은 현재 Metal 및 Direct3D에서 지원됩니다. 엄격한 수학이 사용 중지되면 컴파일러는 다음과 같은 방법으로 셰이더를 최적화할 수 있습니다.
- NaN 및 무한대 값의 가능성 무시.
- -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 });
GPUAdapter requestAdapterInfo() 삭제
GPUAdapter requestAdapterInfo()
비동기 메서드는 GPUAdapter info
속성을 사용하여 이미 GPUAdapterInfo를 동기식으로 가져올 수 있으므로 중복됩니다. 따라서 비표준 GPUAdapter requestAdapterInfo()
메서드가 삭제되었습니다. 삭제 인텐트를 참고하세요.
Dawn 업데이트
tint_benchmark
실행 파일은 WGSL에서 각 백엔드 언어로 셰이더를 변환하는 데 드는 비용을 측정합니다. 자세한 내용은 새 문서를 참고하세요.
여기에는 주요 내용 중 일부만 다룹니다. 전체 커밋 목록을 확인하세요.
WebGPU의 새로운 기능
WebGPU의 새로운 기능 시리즈에서 다룬 모든 내용 목록
Chrome 131
- WGSL에서 거리 클립하기
- GPUCanvasContext getConfiguration()
- 점 및 선 원시에는 깊이 바이어스가 없어야 함
- 하위 그룹을 위한 포용 스캔 기본 제공 함수
- 다중 그리기 간접 실험적 지원
- 셰이더 모듈 컴파일 옵션 엄격한 수학
- GPUAdapter requestAdapterInfo() 삭제
- Dawn 업데이트
Chrome 130
Chrome 129
Chrome 128
- 하위 그룹 실험
- 선 및 점에 대한 깊이 편향 설정 지원 중단
- preventDefault인 경우 포착되지 않은 오류 DevTools 경고 숨기기
- WGSL은 먼저 샘플링을 보간하고 다음 중 하나를 실행합니다.
- Dawn 업데이트
Chrome 127
Chrome 126
Chrome 125
Chrome 124
Chrome 123
- WGSL의 DP4a 내장 함수 지원
- WGSL의 제한되지 않은 포인터 매개변수
- WGSL에서 합성물 역참조를 위한 문법 슈가
- 스텐실 및 깊이 측면의 별도 읽기 전용 상태
- Dawn 업데이트
Chrome 122
Chrome 121
- Android에서 WebGPU 지원
- Windows에서 셰이더 컴파일에 FXC 대신 DXC 사용하기
- 컴퓨팅 및 렌더링 패스의 타임스탬프 쿼리
- 셰이더 모듈의 기본 진입점
- display-p3를 GPUExternalTexture 색상 공간으로 지원
- 메모리 힙 정보
- Dawn 업데이트
Chrome 120
Chrome 119
Chrome 118
copyExternalImageToTexture()
의 HTMLImageElement 및 ImageData 지원- 읽기-쓰기 및 읽기 전용 저장소 텍스처를 실험적으로 지원합니다.
- Dawn 업데이트
Chrome 117
- 꼭짓점 버퍼 설정 해제
- 바인드 그룹 설정 해제
- 기기 연결이 끊겼을 때 비동기 파이프라인 생성 오류를 표시하지 않음
- SPIR-V 셰이더 모듈 만들기 업데이트
- 개발자 환경 개선
- 자동으로 생성된 레이아웃으로 파이프라인 캐싱
- Dawn 업데이트
Chrome 116
- WebCodecs 통합
- GPUAdapter
requestDevice()
에서 반환된 분실 기기 importExternalTexture()
가 호출될 때 동영상 재생을 원활하게 유지- 사양 준수
- 개발자 환경 개선
- Dawn 업데이트