From 3b10a1f47fd5838fe3b94c19673a52610b88cf1e Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.net>
Date: Sun, 1 Mar 2026 14:20:08 -0800
Subject: perf: optimise list hot paths and shared timers

---
 src/lib/Media/Anime/Airing/AiringTime.svelte | 180 +++++++++++++--------------
 1 file changed, 88 insertions(+), 92 deletions(-)

(limited to 'src/lib/Media')

diff --git a/src/lib/Media/Anime/Airing/AiringTime.svelte b/src/lib/Media/Anime/Airing/AiringTime.svelte
index 8cf1cacc..ff888629 100644
--- a/src/lib/Media/Anime/Airing/AiringTime.svelte
+++ b/src/lib/Media/Anime/Airing/AiringTime.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
   import type { Media } from '$lib/Data/AniList/media';
   import settings from '$stores/settings';
-  import { onDestroy, onMount } from 'svelte';
   import type { MediaPrequel } from '$lib/Data/AniList/prequels';
   import tooltip from '$lib/Tooltip/tooltip';
   import locale from '$stores/locale';
+  import airingNow from '$stores/airingNow';
 
   export let originalAnime: Media;
   export let upcoming = false;
@@ -16,109 +16,105 @@
   let nextEpisode = anime.nextAiringEpisode?.episode || 0;
   let few = true;
   let dateString = '';
-  let updateInterval: ReturnType<typeof setInterval>;
-
-  onMount(() => {
-    const setAiringTime = () => {
-      time = '';
-      timeFrame = '';
-      dateString = '';
-
-      const airingAt = anime.nextAiringEpisode?.airingAt;
-      const untilAiring = airingAt
-        ? Math.round((airingAt - Date.now() / 1000) * 100) / 100
-        : undefined;
-      let hours = null;
-      const shortenCountdown = $settings.displayShortCountdown;
-
-      time = new Date(airingAt ? airingAt * 1000 : 0).toLocaleTimeString([], {
-        hour12: !$settings.display24HourTime,
-        hour: 'numeric',
-        minute: '2-digit'
-      });
-
-      if (
-        (anime as unknown as MediaPrequel).startDate &&
-        new Date(
-          anime.startDate.year,
-          (anime as unknown as MediaPrequel).startDate.month,
-          (anime as unknown as MediaPrequel).startDate.day
-        ) < new Date()
-      )
-        return `<span class="opaque">on ${new Date(
-          anime.startDate.year,
-          (anime as unknown as MediaPrequel).startDate.month,
-          (anime as unknown as MediaPrequel).startDate.day
-        ).toLocaleDateString()}</span>`;
-
-      if (untilAiring !== undefined) {
-        let minutes = Math.round(untilAiring / 60);
-
-        few = true;
-
-        if (minutes > 60) {
-          hours = minutes / 60;
-
-          if (hours > 24) {
-            const days = Math.floor(hours / 24);
-            const weeks = Math.floor(days / 7);
-
-            few = false;
-
-            if (weeks >= 1.5) {
-              timeFrame = `${weeks}${shortenCountdown ? 'w' : ' week'}${
-                weeks === 1 || shortenCountdown ? '' : 's'
-              }`;
-
-              const residualDays = days % 7;
-
-              if (residualDays > 0)
-                timeFrame += `${shortenCountdown ? '' : ' '}${residualDays}${
-                  shortenCountdown ? 'd' : ' day'
-                }${residualDays === 1 || shortenCountdown ? '' : 's'}`;
-            } else {
-              timeFrame += `${days}${shortenCountdown ? 'd' : ' day'}${
-                days === 1 || shortenCountdown ? '' : 's'
-              }`;
-            }
-
-            const residualHours = Math.floor(hours - days * 24);
-
-            if (residualHours > 0)
-              timeFrame += `${shortenCountdown ? '' : ' '}${residualHours}${
-                shortenCountdown ? 'h' : ' hour'
-              }${residualHours === 1 || shortenCountdown ? '' : 's'}`;
-          } else {
-            const residualMinutes = Math.round(minutes - Math.floor(hours) * 60);
-
-            timeFrame += `${Math.floor(hours).toFixed(0)}${shortenCountdown ? 'h' : ' hour'}${
-              Math.floor(hours) === 1 || shortenCountdown ? '' : 's'
+  const setAiringTime = () => {
+    time = '';
+    timeFrame = '';
+    dateString = '';
+
+    const airingAt = anime.nextAiringEpisode?.airingAt;
+    const untilAiring = airingAt
+      ? Math.round((airingAt - $airingNow / 1000) * 100) / 100
+      : undefined;
+    let hours = null;
+    const shortenCountdown = $settings.displayShortCountdown;
+
+    time = new Date(airingAt ? airingAt * 1000 : 0).toLocaleTimeString([], {
+      hour12: !$settings.display24HourTime,
+      hour: 'numeric',
+      minute: '2-digit'
+    });
+
+    if (
+      (anime as unknown as MediaPrequel).startDate &&
+      new Date(
+        anime.startDate.year,
+        (anime as unknown as MediaPrequel).startDate.month,
+        (anime as unknown as MediaPrequel).startDate.day
+      ) < new Date()
+    )
+      return `<span class="opaque">on ${new Date(
+        anime.startDate.year,
+        (anime as unknown as MediaPrequel).startDate.month,
+        (anime as unknown as MediaPrequel).startDate.day
+      ).toLocaleDateString()}</span>`;
+
+    if (untilAiring !== undefined) {
+      let minutes = Math.round(untilAiring / 60);
+
+      few = true;
+
+      if (minutes > 60) {
+        hours = minutes / 60;
+
+        if (hours > 24) {
+          const days = Math.floor(hours / 24);
+          const weeks = Math.floor(days / 7);
+
+          few = false;
+
+          if (weeks >= 1.5) {
+            timeFrame = `${weeks}${shortenCountdown ? 'w' : ' week'}${
+              weeks === 1 || shortenCountdown ? '' : 's'
             }`;
 
-            if (residualMinutes > 0)
-              timeFrame += `${shortenCountdown ? '' : ' '}${residualMinutes}${
-                shortenCountdown ? 'm' : ' minute'
-              }${residualMinutes === 1 || shortenCountdown ? '' : 's'}`;
+            const residualDays = days % 7;
+
+            if (residualDays > 0)
+              timeFrame += `${shortenCountdown ? '' : ' '}${residualDays}${
+                shortenCountdown ? 'd' : ' day'
+              }${residualDays === 1 || shortenCountdown ? '' : 's'}`;
+          } else {
+            timeFrame += `${days}${shortenCountdown ? 'd' : ' day'}${
+              days === 1 || shortenCountdown ? '' : 's'
+            }`;
           }
+
+          const residualHours = Math.floor(hours - days * 24);
+
+          if (residualHours > 0)
+            timeFrame += `${shortenCountdown ? '' : ' '}${residualHours}${
+              shortenCountdown ? 'h' : ' hour'
+            }${residualHours === 1 || shortenCountdown ? '' : 's'}`;
         } else {
-          minutes = Math.round(minutes);
+          const residualMinutes = Math.round(minutes - Math.floor(hours) * 60);
 
-          timeFrame += `${minutes}${shortenCountdown ? 'm' : '  minute'}${
-            minutes === 1 || shortenCountdown ? '' : 's'
+          timeFrame += `${Math.floor(hours).toFixed(0)}${shortenCountdown ? 'h' : ' hour'}${
+            Math.floor(hours) === 1 || shortenCountdown ? '' : 's'
           }`;
+
+          if (residualMinutes > 0)
+            timeFrame += `${shortenCountdown ? '' : ' '}${residualMinutes}${
+              shortenCountdown ? 'm' : ' minute'
+            }${residualMinutes === 1 || shortenCountdown ? '' : 's'}`;
         }
+      } else {
+        minutes = Math.round(minutes);
 
-        opacity = Math.max(50, 100 - (untilAiring / 60 / 60 / 24 / 7) * 50);
-        dateString = $locale().dateFormatter(new Date(airingAt ? airingAt * 1000 : 0));
+        timeFrame += `${minutes}${shortenCountdown ? 'm' : '  minute'}${
+          minutes === 1 || shortenCountdown ? '' : 's'
+        }`;
       }
-    };
 
-    setAiringTime();
+      opacity = Math.max(50, 100 - (untilAiring / 60 / 60 / 24 / 7) * 50);
+      dateString = $locale().dateFormatter(new Date(airingAt ? airingAt * 1000 : 0));
+    }
+  };
 
-    updateInterval = setInterval(setAiringTime, 30000);
-  });
+  $: {
+    $airingNow;
 
-  onDestroy(() => clearInterval(updateInterval));
+    setAiringTime();
+  }
 </script>
 
 {#if upcoming}
-- 
cgit v1.2.3