Add image optimisation

[KleeUT]

We're currently serving oversized images, let's add something to help us generate images that are a better size
Possible options include:

• https://madewithsvelte.com/svelte-image
• https://rodneylab.com/sveltekit-image-plugin/
  I haven't looked closely at either of these options

[Calinator444]

I haven't really found a method of resizing images before sending them out, but I might have a method of reducing load times. Essentially it involves using the Intersection Observer API to check whether the image has entered the view port. Before the image is loaded, the dominant color of the image is used as a placeholder (the dominant color is determined using this tool). When the image enters the viewport, the background url is set to the appropriate image.

I created a mockup using standard html and CSS. A few of these things can be tweaked of course, such as when images pop in, how long they take to fade in or whether there's a transition animation.