Try moving image optimization

Author: RobbieTheWagner

src/components/Player.tsx

@@ -26,7 +26,6 @@ export default function Player() {
       setProgress(percentage);
       const slider = document.querySelector('.slider');
       if (slider) {
-        console.log(percentage);
         (slider as HTMLElement).style.setProperty(
           '--seek-before-width',
           `${percentage}%`

src/lib/optimize-episode-image.ts

@@ -1,16 +1,15 @@
 import { getImage } from 'astro:assets';
 
-import type { Episode } from './rss';
-
-export async function optimizeEpisodeImage(episode: Episode) {
-  if (episode.episodeImage) {
+export async function optimizeEpisodeImage(episodeImage?: string) {
+  if (episodeImage) {
     const optimizedImage = await getImage({
-      src: episode.episodeImage,
+      src: episodeImage,
       format: 'avif',
       height: 160,
       width: 160,
       quality: 75
     });
-    episode.episodeImage = optimizedImage.src;
+
+    return optimizedImage.src;
   }
 }

src/lib/rss.ts

@@ -59,43 +59,41 @@ export async function getAllEpisodes() {
   let feed = (await parseFeed.parse(starpodConfig.rssFeed)) as Show;
   let items = parse(FeedSchema, feed).items;
 
-  let episodes: Array<Episode> = items
-    .filter((item) => item.itunes_episodeType !== 'trailer')
-    .map(
-      ({
-        description,
-        id,
-        title,
-        enclosures,
-        published,
-        itunes_episode,
-        itunes_episodeType,
-        itunes_image
-      }) => {
-        const episodeNumber =
-          itunes_episodeType === 'bonus' ? 'Bonus' : `${itunes_episode}`;
-        const episodeSlug = dasherize(title);
-
-        return {
+  let episodes: Array<Episode> = await Promise.all(
+    items
+      .filter((item) => item.itunes_episodeType !== 'trailer')
+      .map(
+        async ({
+          description,
           id,
-          title: `${title}`,
-          content: description,
-          description: truncate(htmlToText(description), 260),
-          episodeImage: itunes_image?.href,
-          episodeNumber,
-          episodeSlug,
+          title,
+          enclosures,
           published,
-          audio: enclosures.map((enclosure) => ({
-            src: enclosure.url,
-            type: enclosure.type
-          }))[0]
-        };
-      }
-    );
+          itunes_episode,
+          itunes_episodeType,
+          itunes_image
+        }) => {
+          const episodeNumber =
+            itunes_episodeType === 'bonus' ? 'Bonus' : `${itunes_episode}`;
+          const episodeSlug = dasherize(title);
 
-  for (const episode of episodes) {
-    await optimizeEpisodeImage(episode);
-  }
+          return {
+            id,
+            title: `${title}`,
+            content: description,
+            description: truncate(htmlToText(description), 260),
+            episodeImage: await optimizeEpisodeImage(itunes_image?.href),
+            episodeNumber,
+            episodeSlug,
+            published,
+            audio: enclosures.map((enclosure) => ({
+              src: enclosure.url,
+              type: enclosure.type
+            }))[0]
+          };
+        }
+      )
+  );
 
   return episodes;
 }