Search notes:

WebGL

WebGL is a JavaScript port of the OpenGL ES 2.0 graphics library which makes it possible for web pages to compute a graphic on a device's GPU and render the result in a <canvas> HTML element.

WebGL is part of the Web platform.

WebGL program

A WebGL programm is created with program = gl.createProgram().

A WebGL programm needs two shaders: a vertex shader and a fragment shader.

Shader

Shaders can be thought of as functions of the program that run on the GPU. They are written in a language called Graphic Library Shader Language.

There are two types of shaders:

Vertex shaders: They define vertices on the screen by assigning a 4-element vector to gl_position.
Fragment shaders: they run once for each pixel on the scene and determine their color values by assigning a 4-element vector to gl_FragColor.

In JavaScript, a shader is created with shader = gl.createShader().

The source code for a shader is indicated with gl.shaderSource(shader, source_code).

Then the shader is compiled with gl.compileShader(shader)).

Finally, the shaders are added to the gl-program with gl.attachShaders(gl_program, shader).

Vertex Buffer Object

Abbreviated with VBO.

Determining if WebGL is supported

If a browser supports WebGL can be determined by checking for the existance of window.WebGLRenderingContext with JavaScript.

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Does the browser support webgl?</title>

  <script type="application/x-javascript">
  function main() {
     var result = document.getElementById('result');
     if (window.WebGLRenderingContext) {
        result.innerHTML = "Browser supports WebGl";
     }
     else {
        result.innerHTML = "Browser does not suppoert WebGl";
     }
  }
  window.onload = main;
  </script>

</head>

<body onload='main()'>
  <div id='result'></div>
</body>

</html>

Github repository about-WebGL, path: /does-browser-support-webgl.html

Successor of WebGL: WebGPU

WebGL focuses on drawing graphics. Because since the inception of WebGL, the need to use a GPU for other tasks («general purpose GPU» or GPGPU) has increased, a successor of WebGL was created: the WebGPU API.