HN Explorer

Show HN: VoxelChain – An Experimental Voxel Engine (voxelchain.app)

118 points by x1m4 ↗ HN
VoxelChain is an experimental tool to create voxel worlds in the browser. The lighting is fully ray traced in real-time and there is powerful cellular-automata based programming system, which allows to create complex digital circuits and model the behaviour of voxels (behaviour such as falling sand or water).

Technology wise, I'm using WebGL2 for the rendering and the simulation is coded in C89 and gets compiled to WebAssembly (with multi-threading) using Clang. The simulation is basically a custom cellular automaton and is fully parallelized. Once WebGPU is released, I'm planning to run the simulation on the GPU, instead of the CPU, which will give a massive speed up.

I've been working on this project full-time for over a year now, and finally came to the point of realising a public version of it to play with. There is already some really cool stuff that the community has built, and it's super fun to see how everything evolves!

Let me know what you think and feel free to ask any questions :>

40 comments

[ 3.1 ms ] story [ 83.1 ms ] thread
SuboptimalEng
Great to see the project on the front page of HN - congrats on launching!

The author's got tons of video demos on their YouTube channel[0] as well.

[0] https://www.youtube.com/c/xima1

x1m4
Thank you! I've already tried to make a post a couple days ago, but it got immediately hit by the spam filters. Big thanks to the HN support for resolving this so quickly :>
mooman219
I understand the depth of field is cool, but the demos (https://voxelchain.app/previewer/Demo.html) are excessively blurry to the point of unusability, and rapidly changes so often it gives me a headache (https://imgur.com/a/bSEFuX7).

Otherwise nice work!

x1m4
Yes the DOF definitely needs some more work. For screenshots it somewhat works, but when actively exploring a scene, it's actually more confusing than useful.

EDIT: Reduced the DOF intensity

olah_1
What is the end goal? I see there is logic included, does that mean it will be a full game engine? Or maybe a fantasy console?
x1m4
At the current stage, the project is more like an editor and playground for designers and coders. But I'm planning on adding a player and entity system, which would allow creators to build actual tiny games with this.
matheist
The live demo doesn't work for me on Firefox on macOS (FF 105, macOS 12.4, M1) with a "WebGL is not available" error message.

Console error shows:

    WebGL warning: readPixels: Format and type RGBA_INTEGER/UNSIGNED_BYTE incompatible with this RGBA8UI attachment. This framebuffer requires either RGBA_INTEGER/UNSIGNED_INT or getParameter(IMPLEMENTATION_COLOR_READ_FORMAT/_TYPE) RGBA_INTEGER/UNSIGNED_INT.
x1m4
Thanks for the report! I've tried to tackle this issue multiple times now, but found that for some reason on MacOS M1, FireFox's WebGL implementation is severely broken on multiple features that the WebGL specification guarantees to be working. I can't test if this is just for the M1 or also other Mac devices, but Chrome definitely works!
danparsonson
Just to add that I'm seeing the same error on Fedora 36 with FF 103.0.2 64-bit
x1m4
Does Chrome work for you?
danparsonson
Don't have it installed but if I can find time I'll give it a go
ceearrbee
I am on Fedora 36 and it doesn't run in Firefox either, however it does run in Chrome.
eganist
fwiw, it worked on Firefox for Windows.
isomorphic
I get "WebGL is not available" on an Intel Mac Pro, macOS 12.5.1, Firefox Developer 105.0b8. ("Intel Mac Pro" is redundant at the time of this writing, but hopefully not for long!)

On the same Mac, I get "Your browser is not supported" for Safari 15.6.1, and Safari Technology Preview R152 (Safari 16.0) with "WebGL 2.0" and "WebGL Draft Extensions" enabled under "Experimental Features."

Using Ungoogled Chromium 105.0.5195.102 (I refuse to use Chrome), the site actually seems to leave the GPU in a messed-up state, going on to cause severe rendering problems in other applications. I'm not sure if this is a Chromium bug or a macOS bug or both.

AtomicOrbital
I get same error on ff 105.0a1 (2022-08-01) (64-bit) running on Ubuntu 22.04 ... however I know WebGL runs fine on this setup

on same laptop using chrome Version 106.0.5249.21 (Official Build) dev (64-bit) get error

[.WebGL-0x1b80018ed800]GL ERROR :GL_INVALID_OPERATION : glDrawArrays: Source and destination textures of the draw are the same.

again this same chrome browser runs other WebGL just fine

bob1029
Pretty neat work. I was looking at voxels for a while when working on a 3d engine for a side project. There are a lot of very compelling math & performance reasons to go down this path.

That said, I wonder if newer tech like nanite has started to displace these techniques. When you get to a point where you can rasterize triangles that are smaller than a single pixel at interactive frame rates, one starts to wonder what unique advantages voxels still bring to the table.

aothms
Rendering is maybe not the only aspect of 3d engine. The robustness and ease of implementation of boolean operations or other kind of volumetric analysis has for me been one of the reasons to invest time in an open source procedural geometric analysis framework using voxels.
[deleted]
(comment deleted)
ajudson
Are you planning to release the source? I want to learn wasm + webgl and this seems like an great project to learn from. If not would love to hear what resources you recommend for learning
x1m4
I have no plans to open-source the engine, but there is a WIP effort [0] to allow programming with the public API that the engine exposes in the editor on the website. Currently the API is mostly used for procedurally generating worlds.

- [0] https://github.com/VoxelChain/voxelchain-programming

ajudson
Are there any resources you recommend for learning webgl + wasm?
x1m4
Instead of WebGL, I'd recommend to give WebGPU a try first, as it's a much better designed API. I'd even say that once you've learned the few core concepts of WebGPU (such as command buffers), it's an easier to learn API than the notable chaos that WebGL/OpenGL introduces.
shodan757
The optimizations that went into this must be pretty impressive for it to run as well as it does on my Framework laptop (11th gen, no dGPU). I did have to run it in Chrome since Firefox gets the "unsupported browser" error[0]. Glad I tried it out since typically "I made a voxel engine" wouldn't catch my attention. ;)

[0] console: "WebGL warning: readPixels: Format and type RGBA_INTEGER/UNSIGNED_BYTE incompatible with this RGBA8UI attachment. This framebuffer requires either RGBA_INTEGER/UNSIGNED_INT or getParameter(IMPLEMENTATION_COLOR_READ_FORMAT/_TYPE) RGBA_INTEGER/UNSIGNED_INT."; Firefox 104.0.1; openSUSE Leap 15.4

x1m4
I've actually spent the majority of development time on optimization rather than actually working on the overall product. The choice to create this project in the browser instead of native certainly made this more challenging! :> And thanks for the report, I'm gonna give this another try to fix, and otherwise gonna forward this to the Firefox devs.
marcooliv
Not a developer but I'm really impressed with the quality and high fps. Following to keep updated. Good luck!
fwilliams
Tried this on chrome and it's pretty awesome!

Unfortunately it doesn't work on Firefox on Ubuntu 20.04 with an NVIDIA GTX 3090Ti. :(

IAmGraydon
Working on Firefox 104.0.2 under Windows 11.
jaught
Amazing! I was looking to experiment in the voxel space and I will check out the API!

For someone naive to making games with voxel's, are there any resources that you would recommend (rendering, mathematics, ...)? My thought was to look at resources similar to how Noita simulated their pixels (GDC talks) and attempt to scale that into 3D.

FrostKiwi
C -> WebGL -> WASM. Exactly the setup for my next project. Great to see someone else having success with such a workflow.
imetatroll
I work on a personal project - a vtt (link in bio) - from time to time that uses webgl2 to render simple objects. Rendering is done in javascript (transpiled from golang) and does fairly well. I am not doing anything quite as intensive as raytracing but I do cast rays in order to generate 3D shadows.

Would you mind explaining what approaches are available for debugging webgl running in webassembly?

Did you chose webassembly for a specific reason rather than just using javascript?

What webgl2 apis do you recommend using to keep FPS reasonably high? I've been using instancing for most of what I render as it is said to be highly efficient.

Just curious!

EDIT: Just looking at your youtube channel and your project is really impressive!

fenomas
Looks great, congrats on launching!

Are any of the demos interactive, apart from moving the camera? Two of them seem to have buttons, but they don't respond to clicks.

x1m4
You should be able to click on the buttons with a left mouse click. Currently worlds that are exported as HTML doesn't contain any editing functionality except being able to interact with voxels.
sebsauvage
In Firefox : « Your browser is not supported - WebGL is not available. »

Meh.

DonHopkins
Wonderful work! I love how it looks, especially the lighting and indirect voxel radiance, which is gorgeous.

Can you please describe the cellular automata rules you're using, what your goals and techniques were, and what inspired you?

x1m4
For the lighting I'm using a mix of ray tracing and stochastic cone tracing. Cone tracing mainly because it's very cache friendly and almost doesn't introduce any noise. I'm not really using a regular cellular automata or rules, it's just similar on the aspect that the simulation is based on neighbors.

I took some inspiration from Noita and Sandspiel, but I found that falling sand simulations aren't flexible enough and I was thinking about how a system could be created to visually program the behaviour of circuits or stuff like falling sand yourself. Also Noita is single buffered, while my simulation is double buffered which actually makes a huge difference in the possible features you can realize. Single buffering is faster but much more chaotic and "random", while with double buffering you get very precise behaviour. Also the simulation was designed from the ground up to be run on the GPU, while Noita and Sandspiel are CPU-based. Here's [0] a video of a previous 2D prototype doing falling sand on the GPU

- [0] https://www.youtube.com/watch?v=aWLPEzngkOo