awesome-webgl - A curated list of awesome WebGL libraries, resources and much more

  •        23

This is a curated list of awesome WebGL libraries, resources and much more. WebGL (Web Graphics Library) is a JavaScript API for rendering interactive 3D computer graphics and 2D graphics within any compatible web browser without the use of plug-ins. WebGL is integrated completely into all the web standards of the browser allowing GPU accelerated usage of physics and image processing and effects as part of the web page canvas.

https://github.com/sjfricke/awesome-webgl

Tags
Implementation
License
Platform

   




Related Projects

webgl-fundamentals - WebGL lessons that start with the basics

  •    HTML

This is a series of lessons or tutorials about WebGL. Unlike most WebGL lessons these are not based off of OpenGL. OpenGL is 20 years old. The lessons of OpenGL don't match well with WebGL. The APIs have changed too much. The ideas of OpenGL and OpenGL tutorials are out of date with WebGL, OpenGL ES 2.0 and the land of shaders.

webgl2-fundamentals - WebGL 2 lessons starting from the basics

  •    HTML

This is a series of lessons or tutorials about WebGL2. Unlike most WebGL lessons these are not based off of OpenGL. OpenGL is 20 years old. The lessons of OpenGL don't match well with WebGL. The APIs have changed too much. The ideas of OpenGL and OpenGL tutorials are out of date with WebGL, OpenGL ES 3.0 and the land of shaders.

awesome-creative-coding - 🎨 Creative Coding: Generative Art, Data visualization, Interaction Design, Resources

  •    HTML

Carefully curated list of awesome creative coding resources primarily for beginners/intermediates. Creative coding is a different discipline than programming systems. The goal is to create something expressive instead of something functional. Interaction design, information visualization and generative art are all different types of creative coding – which has become a household term describing artworks articulated as code.

graphics-resources - :memo: a list of graphic programming resources

  •    Javascript

A few of my bookmarks related to game development and realtime graphics programming.This will download all PDFs and power-point slides into a folder called resources.

HTML-GL - Get as many FPS as you need and amazing effects by rendering HTML/CSS in WebGL

  •    Javascript

HTML GL solves "the slow DOM problem" by creating WebGL representations of DOM elements and hiding actual DOM after. This speeds up HTML/CSS animations and transformations by using 3D hardware acceleration and allows to apply OpenGL effects as modern 3D games have. Using HTML GL you still work with HTML/CSS as you are common to, but DOM elements are just facades to their WebGL representations. These GPU accelerated textures are very effective from resources consuming perspective and are very cheap to transform or animate.


glTF-WebGL-PBR - Physically-Based Rendering in glTF 2.0 using WebGL

  •    Javascript

This is a raw WebGL demo application for the introduction of physically-based materials to the core glTF 2.0 spec. This project is meant to be a barebones reference for developers looking to explore the widespread and robust capabilities of these materials within a WebGL project that isn't tied to any external graphics libraries. For a DirectX sample please head over to this repo instead. If you would like to see this in action, view the live demo.

webgl-workshop - :mortar_board: The sequel to shader-school: Learn the WebGL API

  •    Javascript

Learn the basics of WebGL in small, manageable chunks. The sequel to shader-school, created for CampJS IV by Mikola Lysenko and Hugh Kennedy. The script will ask you if you want to create an answer directory, press y to accept. This will populate your current directory with shader files for you to edit for each lesson.

webgl-2d - Canvas2D API in WebGL

  •    Javascript

This project aims to be a complete port of the Canvas2D API implemented in a WebGL context. WebGL-2D is a proof of concept and attempts to ascertain performance improvements over Canvas2D. It should allow most Canvas2D applications to be switched to a WebGL context.

WebGL - The Official Khronos WebGL Repository

  •    HTML

This is the official home of the Khronos WebGL repository for the WebGL specifications and the WebGL conformance test suite. Before adding a new test or editing an existing test please read these guidelines.

picogl.js - A minimal WebGL 2 rendering library

  •    Javascript

PicoGL.js is minimal WebGL 2 rendering library. It's meant for developers who understand the WebGL 2 rendering pipeline and want to use it, but with a more convenient API. Typical usage of PicoGL.js will involve creating programs, vertex buffers, vertex arrays, uniform buffers, framebuffers, textures, transform feedbacks, and combining them into draw calls. Note that PicoGL.js is not a scene graph library. There are no objects, hierarchies, transforms, materials, etc. It has been designed only to make management of GPU state more convenient. Its conceptual model maps fairly directly to the constructs one deals with when writing directly with the WebGL 2 API. The only higher-level construct is the draw call, which manages sets of related lower-level constructs.

lightgl.js - A lightweight WebGL library

  •    Javascript

This library makes it easier to quickly prototype WebGL applications. It's lower level than many other WebGL libraries and while it doesn't provide a scene graph, it re-implements OpenGL's modelview/projection matrix stack to provide similar functionality. It also re-introduces some built-in uniforms from GLSL (such as gl_Vertex and gl_ModelViewProjectionMatrix) and OpenGL's immediate mode. The latest lightgl.js build can be found at http://evanw.github.com/lightgl.js/lightgl.js.

pixi

  •    Javascript

The aim of this project is to provide a fast lightweight 2D library that works across all devices. The PixiJS renderer allows everyone to enjoy the power of hardware acceleration without prior knowledge of WebGL. Also, it's fast. Really fast. PixiJS is a rendering library that will allow you to create rich, interactive graphics, cross platform applications, and games without having to dive into the WebGL API or deal with browser and device compatibility.

keras-js - Run Keras models in the browser, with GPU support using WebGL

  •    Javascript

**This project is no longer active. Please check out TensorFlow.js.** The Keras.js demos still work but is no longer updated. Run Keras models in the browser, with GPU support provided by WebGL 2. Models can be run in Node.js as well, but only in CPU mode. Because Keras abstracts away a number of frameworks as backends, the models can be trained in any backend, including TensorFlow, CNTK, etc.

G3D - A pure 3D render engine compatible with webgl, running both in browser and gcanvas.

  •    Javascript

G3D is a javascript 3D engine based on WebGL. Compared with other WebGL 3D engines, G3D is a pure render engine, which means it depends on no DOM APIs but just a canvas(or canvas-like) object. This feature makes it possible that G3D works not only in browser but also in some hybrid environments like GCanvas (Weex or ReactNative). See website for more information.

twgl.js - A Tiny WebGL helper Library

  •    Javascript

This library's sole purpose is to make using the WebGL API less verbose. If you want to get stuff done use three.js. If you want to do stuff low-level with WebGL consider using TWGL.

webgl-examples - Code examples that accompany the MDN WebGL documentation

  •    Javascript

Code examples that accompany the MDN WebGL documentation

WebGL2Samples - Short and easy to understand samples demonstrating WebGL 2 features

  •    HTML

Run the live WebGL 2 Samples Pack. Short and easy to understand samples demonstrating WebGL 2 features by Shuai Shao (Shrek), Trung Le and contributors. Advised by Patrick Cozzi, University of Pennsylvania.

insight - A helpful Chrome extension for WebGL development

  •    Javascript

Insight is a WebGL debugging toolkit providing a variety of capabilities enabling more productive WebGL development and more efficient WebGL applications. Install Insight from the Chrome Web Store.

react-ape - 🦍• [Work in Progress] React Renderer to build UI interfaces using canvas/WebGL

  •    Javascript

React Renderer to build UI interfaces using canvas/WebGL. React Ape is a react renderer to build UI interfaces using canvas/WebGL. React Ape was built to be an optional React-TV renderer. It's mainly a renderer focused on creating things for TV, PS4, Nintendo Switch, PS Vita, PS3 and low memory devices. If you're curious about the name: It's a "joke" with Netflix's React Gibbon renderer. I choose to use Ape then.

clubber - Application of music theory in audio reactive visualizations

  •    Javascript

This small js library listens to audio sources and extracts the underlying rhythmic information. The linear frequency energies are converted into midi notes which music theory suggests to be a better segregation for music audio. A set of meaningful measurements are produced in a form suitable for direct use in webgl shaders, or any other context. This simple flow provides a powerful framework for the rapid development of awesome audio reactive visualisations.