WebGL

 

.

The cube on top is WebGPU, and the cube on the bottom of this post is WebGL. And the video is a side-by-side comparison if you don't have WebGPU support. As expected is there no differences in their output. But it is two different graphic libraries. Where WebGPU was the one that needed the most code. But then WebGPU can utilize more of the graphic card than WebGL can.

WebGPU has more in common with the libraries Metal, Vulcan, and DirectX 12 than WebGL. And it looks like it will be the successor of WebGL. Of course, I stumbled over it right after starting to learn WebGL. So now I am not sure which I will spend the most time on. WebGPU is pretty young and is still only an experimental feature in some web browsers. So actually, you probably do not see the WebGPU that I have embedded in this post. And for the moment, even if you have support, there is no guarantee that you will see the cube.

I have in this post followed examples from WebKit and have only got them to run in Safari. Other examples I have looked at have only run in a different browser. That includes the one in WebGPU's GitHub. Hopes it is because the WebKit examples do not use the same shader language. I probably have to swap languages since it looks like WGSL will win the battle and not WHLSL. 

Now was the plan to go through some parts of the code and highlighting the differences.  But surprise, I need to work more with both libraries first. So maybe another day.

 

It has gone many years since I started working with graphic programming. And that was with OpenGL. Today I have tried WebGL for the first time. It builds on OpenGL ES 2 that again are simplified OpenGL 2, so everything was familiar. I have followed step by step a Mozilla tutorial. I mostly work like this. Doing tutorials or web courses first, then experiments.

I hope to do some experimental work soon. And it was good doing some graphics programming again, even if it just copied something. The few last years has mainly been theory.

There is not more to say than check the tutorial for details if you are interested.