Improve image performance

[Th3S4mur41]

• Only create 1 high quality (3840??) image via script and rely on Astro's image optimizer for the rest
• Only generate jpg and avif (remove webp) to reduce DOM size
• Consider updating the sizes as suggested in first comment
• Serve optimized hero image based on height

Needs #330

[Th3S4mur41]

<picture>
  <!-- AVIF format (preferred) -->
  <source type="image/avif" srcset="
    image-480.avif 480w,
    image-1024.avif 1024w,
    image-1920.avif 1920w,
    image-3840.avif 3840w" sizes="(max-width: 480px) 480px, 
                                  (max-width: 1024px) 1024px, 
                                  (max-width: 1920px) 1920px, 
                                  100vw">

  <!-- JPEG fallback -->
  <source type="image/jpeg" srcset="
    image-480.jpg 480w,
    image-1024.jpg 1024w,
    image-1920.jpg 1920w,
    image-3840.jpg 3840w" sizes="(max-width: 480px) 480px, 
                                  (max-width: 1024px) 1024px, 
                                  (max-width: 1920px) 1920px, 
                                  100vw">
  <img src="image-1024.jpg" loading="lazy" decode="async" alt="Descriptive text for accessibility">
</picture>