From 0d041c6b61fddb96fe3c65764bf54298cdadbeba Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.net>
Date: Fri, 15 May 2026 10:27:00 +0000
Subject: perf(images): lazy-load and async-decode off-screen imagery

Add loading=lazy and decoding=async to the 16 <img> elements that
weren't already deferring across Tools/Wrapped, Events, EasterEvent,
Hololive, and the rate-limited fallback. Also drop the
backdrop-filter: blur(160px) the dropdown items were paying on every
hover; the background-color change already gives sufficient feedback,
and the parent card's own blur stays.
---
 src/lib/Events/Event.svelte | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/lib/Events/Event.svelte')

diff --git a/src/lib/Events/Event.svelte b/src/lib/Events/Event.svelte
index f8d0efbc..a1d6cf42 100644
--- a/src/lib/Events/Event.svelte
+++ b/src/lib/Events/Event.svelte
@@ -12,14 +12,14 @@ let { event, avatar = false }: { event: Event; avatar?: boolean } = $props();
   style={`background-image: ${event.banner ? `url(${event.banner})` : 'none'}; padding: 0;`}
 >
   {#if event}
-    <img src={event.banner} alt="" id="cover-image" />
+    <img src={event.banner} alt="" loading="lazy" decoding="async" id="cover-image" />
   {/if}
 
   <div class="card" id="user-grid-content">
     {#if avatar}
       <div id="user-grid-avatar">
         <a href={root(`/events/group/${event.group.anilist_username}`)}>
-          <img src={event.group.avatar} alt="" width="100vw" id="avatar" />
+          <img src={event.group.avatar} alt="" loading="lazy" decoding="async" width="100vw" id="avatar" />
         </a>
       </div>
     {/if}
-- 
cgit v1.2.3

