ShaderToy is a tool for writing pixel shaders. What are pixel shaders? If you render a full screen quad, meaning that each of four points is placed in one of the four corners of the viewport, then the fragment shader for that quad is called pixel shader, because you could say that now each fragment … Read more
In Three.js, the utilities CollisionUtils.js and Collisions.js no longer seem to be supported, and mrdoob (creator of three.js) himself recommends updating to the most recent version of three.js and use the Ray class for this purpose instead. What follows is one way to go about it. The idea is this: let’s say that we want … Read more
This determines how much precision the GPU uses when calculating floats. highp is high precision, and of course more intensive than mediump (medium precision) and lowp (low precision). Some systems do not support highp at all, which will cause code not to work at all on those systems. On systems that DO support highp, you … Read more
One way to start/stop is like this var requestId; function loop(time) { requestId = undefined; … // do stuff … start(); } function start() { if (!requestId) { requestId = window.requestAnimationFrame(loop); } } function stop() { if (requestId) { window.cancelAnimationFrame(requestId); requestId = undefined; } } Working example: const timeElem = document.querySelector(“#time”); var requestId; function loop(time) … Read more
The current behaviour, is determined by the endianness of the underlying hardware. As almost all desktop computers are x86, this means little-endian. Most ARM OSes use little-endian mode (ARM processors are bi-endian and thus can operate in either). The reason why this is somewhat sad is the fact that it means almost nobody will test … Read more
Copied directly from http://www.lighthouse3d.com/tutorials/glsl-tutorial/data-types-and-variables/. The actual site has much more detailed information and would be worthwhile to check out. Variable Qualifiers Qualifiers give a special meaning to the variable. The following qualifiers are available: const – The declaration is of a compile time constant. attribute – Global variables that may change per vertex, that are … Read more
Looking at this question from another side: How does a developer choose one technology over another? integrates better in their already built system is easier to use is faster has more capabilities or better suits their needs cost more platform-independent So I’ll discuss the differences between canvas and webGL APIs regarding these qualities. Both canvas … Read more
Since you have big ambitions, you have to invest the time to learn the fundamentals. It is not a matter of what you learn first — you can learn them simultaneously if you want to. (That’s what I did.) This means that you need to understand: WebGL concepts Three.js The underlying mathematical concepts Three.js. Three.js … Read more