WebGPU 실험 프로젝트

WebGPU 기술을 활용한 데모 및 실험 모음입니다. 특히 컴퓨트 셰이더(compute shaders)에 중점을 두었습니다.

데모

설명

WebGPU 기능

선택된 GPU의 기능과 한계를 보여줍니다. "고성능(high-performance)" 또는 "저전력(low-power)" 중 두 가지 다른 GPU 유형을 선택할 수 있습니다. 이 기능은 시스템에 여러 개의 GPU가 있는 경우에만 역할을 합니다.

텍스처 단순 렌더링

단순한 텍스처 렌더링입니다. 이미지가 텍스처로 전송되어 렌더 파이프라인(render pipeline)을 통해 렌더링됩니다.

버텍스 셰이더

프래그먼트 셰이더

전역 조명(Global illumination)

smallpt 레이 트레이서에서 셰이더로 변환한 것입니다.

메인 소스: https://www.shadertoy.com/view/4sfGDB

GLSL에서 WGSL로 번역되었습니다.

컴퓨트 셰이더

프로테안 클라우드 (Protean Clouds)

소스: https://www.shadertoy.com/view/3l23Rh

GLSL에서 WGSL로 번역되었습니다.

컴퓨트 셰이더

콜라츠 추측 (Collatz Conjecture)

소스: https://github.com/gfx-rs/wgpu/tree/trunk/examples/hello-compute

컴퓨트 셰이더

보로노이즈 (Voronoise)

소스: https://www.shadertoy.com/view/Xd23Dh

GLSL에서 WGSL로 번역되었습니다.

컴퓨트 셰이더

FBM

노이즈(Noise)와 FBM(Fractional Brownian Motion) 셰이더입니다.

컴퓨트 셰이더

디퓨즈 레이 트레이싱 (Diffuse Raytracing)

레이-삼각형 교차(ray-triangle intersections)를 기반으로 하는 확산 산란을 이용한 전역 조명입니다.

2D 라이트 (2D Light)

원래 소스: https://www.shadertoy.com/view/4dfXDn

GLSL에서 WGSL로 번역되었습니다.

2D 광원 전파 (2D Light Propagation)

원형 하모닉스(circular harmonics)를 기반으로 하는 광원 전파입니다.

원래 소스: https://www.shadertoy.com/view/fld3R4

GLSL에서 WGSL로 번역되었습니다.

컴퓨트 셰이더

사인 거리 필드 (Signed Distance Field)

소스: https://www.shadertoy.com/view/tdjBzG

GLSL에서 WGSL로 번역되었습니다.

컴퓨트 셰이더

유체 시뮬레이션 (Fluid Simulation)

튜토리얼