Skip to content

oktomus/web-experiments

Repository files navigation

Some of my web experiments. Check my blog where I talk about rendering and shaders.

🚧 Disclaimer: Most of these are made using draft APIs.

WebGL 2.0 Compute: toy ray tracer

ray tracing demo

While this ray tracer is not physically correct and boring, it's a good example of what you can acheive with compute shaders in web.

This was made possible thanks to WebGL 2.0 Compute, an experimental feature currently available on Google Chrome (Linux or Windows).

Many thanks to 9ballsyndrome for his help and especially for his repository WebGL_Compute_shader where you can find really cool stuff made using WebGL 2.0 Compute.

WebGL 2.0 Compute: Random number generator

noise

How to generate random numbers in a compute shader.

WebGL 2.0 Compute: Framebuffer accumulation

accum

Keep a buffer over time and add values onto it. Useful in raytracing to do progressive rendering.

WebGPU: glTF Viewer

A non-finished attempt at foind a glTF viewer like minimal-gltf-loader with the WebGPU API.

viewer

WebGPU: Getting started

What Code link Web demo link
Access the GPU code demo
Create a buffer code demo
Create a buffer and copy it to the GPU code demo
Compile and run a compute shader code demo
Matrix multiplication with compute shader code demo
Draw a triangle with vertex + fragment shader code demo
Draw using a vertex buffer code demo
Draw using a index buffer code demo
Use uniforms in fragment shader code demo
Load and sample a texture code demo
Create a buffer that combines vertices and uvs code demo

Threejs : facing ratio shader

facing

Really basic shader setup with threejs.

Releases

No releases published

Packages

No packages published

Languages