Brick Walls Can Hurt!

Ever hit a brick wall? No? Then you never tried to learn WebGL.

Thankfully this wall has a window and it seems every five hours I spend developing headaches to further my understanding of WebGL another window pane breaks allowing some sort of optimistic outlook that I’ll get through this thing.

Trying to understand why I am learning WebGL throws me back to my undergrad studies where I overheard things like “Why do we have to learn this math if I will never use it in my job?”. The best response I heard from a professor was because it shows you how to think better and more logically.

Well, after a session of doing WebGL for an hour definitely makes my mind feel like the equivalent of spending 5 hours in the gym for my body so I am assuming it is doing something good.

Enough with the analogies.

So far this is where I am after a few days of banging my head on the bricks. The two main points of a WebGL program are a vertex shader and fragment shader. The vertex shader deals with the vertices (points) and the fragment shader involves the space in between.

The language these shaders are written in is called GLSL (Graphics Library Shader Language). GLSL has it’s own built in types which include vec2, vec3 and vec4 along with math types mat2, mat3 and mat4. I think after digging into these specifically the program of 100 + lines to make a triangle will start to be more understandable.

Do you know the best word associated with GLSL?

Swizzle. Yes swizzle. An example taken from the tutorial www.webfundamental.org/webgl is

v.yyyy would equate to vec4(v.y, v.y, v.y, v.y).

Pretty cool and pretty weird. This seems to sum up my feeling of WebGL for this week and I look forward to coming back to it after a few days of getting into some Node.js.

— Brad