Demos and experiments in WebGPU technology. The focus is especially on compute shaders.

Shows the features and limits of the selected GPU. Two different GPU types can be selected. Either "high-performance" or "low-power". This plays only a role, if you have more than one GPU in your system.

Simple texture rendering. The image is transferred into a texture and is rendered via the render pipeline.

Vertex Shader

Fragment Shader

Conversion from the smallpt raytracer into a shader.

Main Source: https://www.shadertoy.com/view/4sfGDB

Translated from GLSL to WGSL.

Compute Shader

Source: https://www.shadertoy.com/view/3l23Rh

Translated from GLSL to WGSL.

Compute Shader

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

Compute Shader

Source: https://www.shadertoy.com/view/Xd23Dh

Translated from GLSL to WGSL.

Compute Shader

A Noise + FBM shader.

Compute Shader

Global illumination with diffuse scattering based on ray-triangle intersections.

Original Source: https://www.shadertoy.com/view/4dfXDn

Translated from GLSL to WGSL.

Light Propagation based on circular harmonics.

Original Source: https://www.shadertoy.com/view/fld3R4

Translated from GLSL to WGSL.

Compute Shader

Source: https://www.shadertoy.com/view/tdjBzG

Translated from GLSL to WGSL.

Compute Shader

Code

https://sotrh.github.io/learn-wgpu/beginner/tutorial5-textures/#loading-an-image-from-a-file