diff --git a/src/app.html b/src/app.html index 30ec61bf1..301e0f334 100644 --- a/src/app.html +++ b/src/app.html @@ -4,13 +4,6 @@ - - - - - - - diff --git a/src/hooks.server.ts b/src/hooks.server.ts index 1dfd6ec10..462fd84a7 100644 --- a/src/hooks.server.ts +++ b/src/hooks.server.ts @@ -22,7 +22,6 @@ export const redis = token: UPSPLASH_TOKEN }) : null; - console.log(`🤓 Cache Status... ${cache_status}`); // import { ADMIN_LOGIN } from '$env/static/private'; diff --git a/src/lib/meta/Meta.svelte b/src/lib/meta/Meta.svelte index 06bd723b5..7e8928b66 100644 --- a/src/lib/meta/Meta.svelte +++ b/src/lib/meta/Meta.svelte @@ -4,18 +4,25 @@ {$page.data.meta.title} + + {#if $page.data.meta.canonical} + + {/if} + {#if $page.data.meta.canonical} + + {/if} - - + + - + diff --git a/src/routes/(blank)/og/[show_number].jpg/+server.ts b/src/routes/(blank)/og/[show_number].jpg/+server.ts index 8de92c2b1..86105d229 100644 --- a/src/routes/(blank)/og/[show_number].jpg/+server.ts +++ b/src/routes/(blank)/og/[show_number].jpg/+server.ts @@ -1,8 +1,11 @@ import { dev } from '$app/environment'; import chrome from '@sparticuz/chromium'; import puppeteer, { Browser } from 'puppeteer-core'; +import { redis } from '../../../../hooks.server.js'; const exePath = '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome'; +const cache = new Map(); + async function getOptions() { if (dev) { return { @@ -45,23 +48,40 @@ export const config = { maxDuration: 30 // vercel timeout 30s }; +const headers = { + 'Content-Type': 'image/jpeg', + // cache for 10 minutes, allow stale to be served for up for another 10 mins + 'cache-control': 'public s-max-age=600, stale-while-revalidate=600' +}; + export async function GET({ url, params }) { const start = performance.now(); const qs = new URLSearchParams(url.search); // const show = qs.get('show'); const show = params.show_number; + // Check if we have a cached version + const cache = redis ? await redis.get(`show-og-${show}`) : null; + if (cache) { + console.log(`serving cached version of ${show}`, cache); + return new Response(Buffer.from(cache, 'base64'), { + status: 200, + headers + }); + } console.time(`Taking screenshot of ${show}`); const photoBuffer = await getScreenshot(`${url.origin}/og/${show}`); console.timeEnd(`Taking screenshot of ${show}`); const end = performance.now(); console.log(`time to render ${show}:`, (end - start) / 1000); + // Store buffer in cache + console.log(`caching ${show} in redis`); + redis?.set(`show-og-${show}`, photoBuffer.toString('base64'), { + ex: 60 * 60 * 5 + }); + return new Response(photoBuffer, { status: 200, - headers: { - 'Content-Type': 'image/jpeg', - // cache for 10 minutes, allow stale to be served for up for another 10 mins - 'cache-control': 'public s-max-age=600, stale-while-revalidate=600' - } + headers }); } diff --git a/src/routes/(blank)/og/[show_number].jpg/698.jpg b/src/routes/(blank)/og/[show_number].jpg/698.jpg new file mode 100644 index 000000000..3cdf52569 Binary files /dev/null and b/src/routes/(blank)/og/[show_number].jpg/698.jpg differ diff --git a/src/routes/(site)/+layout.svelte b/src/routes/(site)/+layout.svelte index 9002d9e0e..215fea491 100644 --- a/src/routes/(site)/+layout.svelte +++ b/src/routes/(site)/+layout.svelte @@ -38,7 +38,7 @@
- + {#if $page.url.pathname !== '/'}
{/if} diff --git a/src/routes/(site)/show/[show_number]/[slug]/+layout.server.ts b/src/routes/(site)/show/[show_number]/[slug]/+layout.server.ts index 89e305072..423f5ab60 100644 --- a/src/routes/(site)/show/[show_number]/[slug]/+layout.server.ts +++ b/src/routes/(site)/show/[show_number]/[slug]/+layout.server.ts @@ -8,6 +8,7 @@ import highlight from 'rehype-highlight'; import { error } from '@sveltejs/kit'; import { cache_mang } from '$utilities/cache_mang'; import type { Prisma, Show } from '@prisma/client'; +import get_show_path from '$utilities/slug.ts'; export const load = async function ({ params, locals, url }) { const { show_number } = params; @@ -73,7 +74,9 @@ export const load = async function ({ params, locals, url }) { } as ShowTemp & Show, meta: { title: show?.title, - image: `https://${url.host}/og/${show_number}.jpg`, + image: `${url.protocol}//${url.host}/og/${show_number}.jpg`, + url: `${url.protocol}//${url.host}${get_show_path(show)}`, + canonical: `${url.protocol}//${url.host}${get_show_path(show)}`, description: show?.aiShowNote?.description ?? show?.show_notes?.match(/(.*?)(?=## )/s)?.[0] } };