Live demo (Opens in a new tab, ~22.6mb)

Please note: the textures of the terrain can take a few seconds to load
Tested on a Nvidia GeForce 950M and Nvidia GeForce 1660 Ti (and 10 FPS on a LG ThinQ G7..)

Why WebGL?

Having used OpenGL a lot in the past for personal projects, I decided I wanted an interactive demo on my website that didn’t need to be downloaded. It runs straight in your browser.

Purpose

I have wanted a personal graphics playground for quite a while. Instead of investing a lot of resources and time into building something in C++ (like Snuffbox), I quickly created a framework that can do all the rendering functionality I need to create stunning visual results. The goal of the framework was not to create a game, but show people what I am capable of given the right features.

Results

Currently I have created a simple scene with a terrain, Rayleigh atmospheric scattering and simple ray-marched clouds. The goal is to implement some model loading (preferably GLTF), particle systems and the Physically Based Rendering & Image Based Lighting that I have worked on earlier.

Features

• Effects with techniques and passes, with both vertex and pixel shaders
• Render targets, both 2D and 3D
• A very simple Entity/Component system
• Transformations with a parent/child hierarchy
• Texture loading
• Custom uniforms
• Custom meshes
• Post-processing full-screen passes
• Simple materials
• GLMatrix for math
• Blend/depth states
• Cameras

Framework: snuffbox-webgl
Terrain demo: terrain-webgl