This is insanely cool. Props to the author. I can see myself using this for sketching some personal projects up.
Unsure if the simulation is decoupled from the display, but it gets a little slow in graphical mode in Firefox. Could be a really interesting WebAssembly optimization project.
The rendering slowness is probably because every cell is rendered as an individual little HTML5 canvas (two, one for off state and one for on state).
Some browsers have no problem at all with so many little canvases, but in firefox it causes a slowdown.
A solution that will hopefully be faster is to make one big canvas instead of many little ones, and blit the cells on it every frame instead of using CSS visibility to swap between on and off states for each cell. Such rewrite of the rendering engine is a todo.
The problem here is not a lack of framework, but the overkill usage of elements.
I think even a game-like approach of using a single canvas and re-rendering the whole screen when something changes would be more efficient than manual DOM mutations.
Wasn't snark, Mr Hostility. DOM manipulation is a very expensive operation and is abstracted by a lot of useful libraries - was wondering if there was a specific reason to not use them.
Canvas is another type of abstraction - and blitting to the screen is easier with it - so same applies.
This is way cool! I've recently been trying to explain this stuff to my 14 year old and now I don't have to! This would be a great learning resource for kids studying STEM.
Many thanks! :)
Nice companion is AllAboutCircuits online textbooks:
https://www.allaboutcircuits.com/textbook/digital/
Archive has the original Bell Labs manual from 1951, with some really beautiful logic gate diagrams
The Design Of Switching Circuits by William Keister, Alistair E Ritchie, Seth H. Washburn
https://archive.org/details/TheDesignOfSwitchingCircuits