Table of Contents

WebGLFundamentals.org

Fix, Fork, Contribute

References

Some other links you might find useful

Tutorials and Lessons

  • 3d game shaders for beginners has many great explanations of many graphics techniques. It is OpenGL based but the explanations are illustrated well and so it should be possible to adapt them to WebGL.

  • Learn OpenGL: Modern OpenGL lessons

    These may or may not be useful. Though the APIs are similar OpenGL is not WebGL. For one OpenGL is a C based library. Another issue is OpenGL has many more features than WebGL and the shader languages have many differences. Still, many of the ideas and techniques shown are just as useful in WebGL as they are in OpenGL.

Helpers / Extensions

  • Spector: An extension to show all your WebGL calls

  • Shader Editor: An extension that lets you view and edit shaders in live web pages.

  • WebGL Insight: An extension to let you see WebGL usage

  • webgl-helpers: Scripts to help with WebGL

Libraries

  • twgl: A library to help make WebGL less verbose.

  • three.js: the most popular JavaScript 3D library.

  • PlayCanvas A WebGL game engine with game editor

  • regl: A stateless functional WebGL library.

Specs

Fun

  • Shadertoy.com: Amazing fragment shaders produced under extreme constraints

    Warning: The shaders on shadertoy.com are usually not the kind of shader that are used in production WebGL apps. Still there are many techniques to be learned from their examples.

  • glslsandbox.com: The original fragment shader playground.

  • vertexshaerart.com: The vertex shader version of glslsandbox.


If you know of other good references to add feel free to open an issue.

Questions? Ask on stackoverflow.
Issue/Bug? Create an issue on github.
Use <pre><code>code goes here</code></pre> for code blocks
comments powered by Disqus