Despite the simplicity of the commit title, this was a pretty big
change. The styling used to just go off of the system's color scheme,
but that can't be overridden. Instead, I have made a variable that
determines whether dark theme is active and made a small panel with some
buttons to change the theme. I had to change a lot of code to achieve
this and lost a lot of hair (I metaphorically pulled it out) from
writing this code.
I also changed things from legacy mode to rune mode (Svelte 4 to 5)
while I was at it, that wasn't too big.
So it turns out the performance improvements were completelty neglected
because my code is bad. The buffer wasn't getting rendered to the canvas
in the best way, and there were too many particles for smaller screens.
I have now added a simple math equasion to the init function that
decides how many particles are needed based on the display size. It
still needs a lot of tweaking, and a more complex function is probably
necessary for good results. I'm still trying to get this background to
not suck and actually look good.
Turns out the performance bottleneck was actually rendering the
gradients every frame, so they are now rendering to a buffer when the
page loads once and that buffer is being rendered as an image every
frame. No functionality has been changed; but it runs so much faster and
is much more efficient on mobile devices.