About, Probably
What?

Just a thing that probably will host all or many simulation-like things I create in the coming future, assuming that it does not require resources not available to a website to create.


Why?

There was once an idea, as all ideas come. This one idea happened to be interesting, and one that seemed perfect to persue. But as all pursuits go, it ended up incomplete, seeming too boring to continue forward. The work to reach that ideal end, so easily crafted by the mind is much more difficult to achieve in code.


I've tried to make many simulations over the years, but the sheer amount of boilerplate code, and other annoying aspects prevented this from being the sole focus. This implied a large amount of work for each small simulation. So, collecting all random simulations and the like I make here, will probably allow me to make more interesting simulations that still are within my minimal expertise of physics.


When?

The simulations will be updated whenever I feel like I want to create a new simulation.

This was probably envisioned sometime in mid 2025, and is being produced during June 2025 if that's what you wanted to know when you read "When?".


Where?

Not all my projects will be here, but as I personally enjoy something about simulations, though I don't know what exactly I find interesting in them, there hopefully will be many simulations here in the near future.


How?
This website uses SvelteKit 5, and Tailwindcss 4 and is hosted on Cloudflare Pages. There is a global canvas variable that gets updated to point to the most recently created canvas component. Only one main canvas is used for all the rendering. This allows for easy abstraction of all the 
ctx.xyz
calls into seperate functional elements for the canvas like 
Text
, 
Path
, 
Circle
etc. which can be rendered in a draw loop, which currently just provides 
frameTime
as the argument. The sliders and checkboxes are based on bits-ui and are used to control variables specific to each simulation, and sveltekit achieves this pretty easily with it's reactivity. It's all pretty simple, but the abstraction allows the focus to not be on how to render but on how to create the simulation most effectively.

Keybinds
As promised, here's your list of keyboard shortcuts: 
  • b
    : Go to the home page (route selector) - Available everywhere, try it!
  • d
    : Open the settings drawer - Available where there's a simulation
  • <Space>
    : Play and pause simulation - Available where there's a simulation