Precached images.

Author: nikoshell

.gitignore

@@ -147,4 +147,4 @@ src/content/days
 src/data/speakers.json
 src/data/sessions.json
 src/data/schedule.json
-src/assets/cache
+public/cache/

astro.config.mjs

@@ -78,9 +78,6 @@ export default defineConfig({
   image: {
     remotePatterns: [{ protocol: "https" }],
     domains: ["programme.europython.eu", "placehold.co"],
-    service: {
-      entrypoint: "src/image.service.ts",
-    },
   },
   experimental: {
     svg: true,

src/content/config.ts

@@ -1,4 +1,31 @@
 import { defineCollection, reference, z } from "astro:content";
+import fs from "fs/promises";
+import path from "path";
+
+const CACHE_DIR = ".cache/data";
+
+async function ensureCacheDir() {
+  await fs.mkdir(CACHE_DIR, { recursive: true });
+}
+
+async function fetchWithCache(url: string, filename: string): Promise<Buffer> {
+  const filePath = path.join(CACHE_DIR, filename);
+
+  try {
+    // Return cached if available
+    const data = await fs.readFile(filePath);
+    console.log(`Fetch from cache: ${filePath}`);
+    return data;
+  } catch {
+    const res = await fetch(url);
+    if (!res.ok) throw new Error(`Failed to fetch: ${url}`);
+
+    const arrayBuffer = await res.arrayBuffer();
+    const buffer: Buffer = Buffer.from(arrayBuffer);
+    await fs.writeFile(filePath, new Uint8Array(buffer));
+    return buffer;
+  }
+}
 
 const tiers = [
   "Keystone",
@@ -54,26 +81,23 @@ const keynoters = defineCollection({
     }),
 });
 
-// Cache for fetched data to prevent duplicate network requests
-let cachedSpeakersData: any = null;
-let cachedSessionsData: any = null;
-
 // Shared data fetching function
 async function getCollectionsData() {
   // Only fetch if not already cached
-  if (!cachedSpeakersData || !cachedSessionsData) {
-    const [speakersResponse, sessionsResponse] = await Promise.all([
-      fetch(
-        "https://gist.github.com/egeakman/469f9abb23a787df16d8787f438dfdb6/raw/62d2b7e77c1b078a0e27578c72598a505f9fafbf/speakers.json"
-      ),
-      fetch(
-        "https://gist.githubusercontent.com/egeakman/eddfb15f32ae805e8cfb4c5856ae304b/raw/466f8c20c17a9f6c5875f973acaec60e4e4d0fae/sessions.json"
-      ),
-    ]);
-
-    cachedSpeakersData = await speakersResponse.json();
-    cachedSessionsData = await sessionsResponse.json();
-  }
+  await ensureCacheDir();
+
+  const speakersBuffer = await fetchWithCache(
+    "https://gist.github.com/egeakman/469f9abb23a787df16d8787f438dfdb6/raw/62d2b7e77c1b078a0e27578c72598a505f9fafbf/speakers.json",
+    "speakers.json"
+  );
+
+  const sessionsBuffer = await fetchWithCache(
+    "https://gist.githubusercontent.com/egeakman/eddfb15f32ae805e8cfb4c5856ae304b/raw/466f8c20c17a9f6c5875f973acaec60e4e4d0fae/sessions.json",
+    "sessions.json"
+  );
+
+  const cachedSpeakersData = JSON.parse(speakersBuffer.toString("utf-8"));
+  const cachedSessionsData = JSON.parse(sessionsBuffer.toString("utf-8"));
 
   // Create indexed versions for efficient lookups
   const speakersById = Object.entries(cachedSpeakersData).reduce(

src/image-cache.ts

@@ -2,39 +2,86 @@ import fs from "fs";
 import Sharp from "sharp";
 import * as crypto from "crypto";
 
-export async function getCachedImage(image_url: string): Promise<string> {
-  const directory = "./src/assets/cache";
-  const name = crypto.createHash("md5").update(image_url).digest("hex");
-  const filename = `${name}.webp`;
-  const path = `${directory}/${filename}`;
-  console.log(`Cache ${path}`);
+const MAX_RETRIES = 3;
+const TIMEOUT_MS = 5000;
+
+async function fetchWithTimeout(
+  url: string,
+  timeout: number,
+  retryCount = 0
+): Promise<Response> {
+  const controller = new AbortController();
+  const timeoutId = setTimeout(() => controller.abort(), timeout);
 
   try {
-    if (!fs.existsSync(path)) {
-      if (!fs.existsSync(directory)) {
-        fs.mkdirSync(directory, { recursive: true });
-      }
+    const response = await fetch(url, {
+      signal: controller.signal,
+      headers: {
+        "User-Agent": "Mozilla/5.0 (compatible; AstroImageFetcher/1.0)",
+        Accept: "image/*",
+      },
+    });
+    clearTimeout(timeoutId);
+
+    if (!response.ok) {
+      throw new Error(`HTTP ${response.status} - ${response.statusText}`);
+    }
+
+    return response;
+  } catch (error) {
+    clearTimeout(timeoutId);
+
+    if (retryCount < MAX_RETRIES) {
+      console.warn(
+        `Retrying fetch for ${url} (attempt ${retryCount + 1}/${MAX_RETRIES})...`
+      );
+      const backoffDelay = Math.pow(2, retryCount) * 1000;
+      await new Promise((resolve) => setTimeout(resolve, backoffDelay));
+      return fetchWithTimeout(url, timeout, retryCount + 1);
+    }
+
+    console.error(`Failed to fetch ${url}:`, error);
+    throw error;
+  }
+}
+
+export async function getCachedImage(imageUrl: string): Promise<string> {
+  // Skip SVG files
+  if (imageUrl.trim().toLowerCase().endsWith(".svg")) {
+    console.log(`Skipping SVG: ${imageUrl}`);
+    return imageUrl;
+  }
 
-      const response = await fetch(image_url);
-      if (!response.ok) {
-        throw new Error(
-          `Failed to fetch image: ${response.status} ${response.statusText}`
-        );
+  if (imageUrl === "") {
+    console.log(`Skipping empty URL: ${imageUrl}`);
+    return imageUrl;
+  }
+
+  const cacheDirectory = "./public/cache";
+  const imageHash = crypto.createHash("md5").update(imageUrl).digest("hex");
+  const imageFilename = `${imageHash}.jpg`;
+  const cachedImagePath = `${cacheDirectory}/${imageFilename}`;
+  const publicImagePath = `${"/cache"}/${imageFilename}`;
+
+  try {
+    if (!fs.existsSync(cachedImagePath)) {
+      if (!fs.existsSync(cacheDirectory)) {
+        fs.mkdirSync(cacheDirectory, { recursive: true });
       }
 
+      const response = await fetchWithTimeout(imageUrl, TIMEOUT_MS);
       const arrayBuffer = await response.arrayBuffer();
-      const buffer = Buffer.from(arrayBuffer);
+      const imageBuffer = Buffer.from(arrayBuffer);
 
       try {
-        await Sharp(buffer).toFile(path);
+        await Sharp(imageBuffer).toFile(cachedImagePath);
       } catch (err) {
         console.error("Error converting image with Sharp:", err);
         throw new Error("Image conversion failed");
       }
     }
 
-    const url = path.startsWith("./") ? path.slice(1) : path;
-    return url;
+    return publicImagePath;
   } catch (err) {
     console.error("Error in getCachedImage:", err);
     throw err;