Changeset f79a471 in Klonkt for src/server.js

Timestamp:

06/28/2026 04:32:37 PM (2 months ago)

Author:

Robin Genis <roboburr@…>

Branches:

main

Children:

74c5abc

Parents:

1ff0043

git-author:

Robin Genis <roboburr@…> (06/28/2026 04:31:09 PM)

git-committer:

Robin Genis <roboburr@…> (06/28/2026 04:32:37 PM)

Message:

feat(images): on-demand lanczos cover thumbnails for crisp grid/list

High-res covers (esp. line-art) looked jagged because the browser downscaled them to
the grid/list size. Downscale server-side with ffmpeg lanczos to a small cached WebP
instead. No re-upload/backfill: reads the existing original lazily on first request.

• services/ThumbnailService.js — ffmpeg lanczos downscale -> WebP, disk-cached
• server.js — GET /media/thumb/:w/* route (whitelist 320/480/640) before the /media static
• middleware/render.js — thumb(url,w) helper (rewrites local /media covers)
• views/partials/post-tile.ejs (grid 480) + post-card.ejs (list 320)

File:

• src/server.js (modified) (2 diffs)

src/server.js

@@ -20 +20 @@
 import { SqliteSessionStore } from './services/SqliteSessionStore.js';
 import { ensurePrimarySite } from './services/ensurePrimarySite.js';
+import { getThumbnail, THUMB_SIZES } from './services/ThumbnailService.js';
 import { resolveSite, loadAudioTracks, loadTheme } from './middleware/site.js';
 import { isViewer } from './middleware/auth.js';
@@ -213 +214 @@
 
 app.use('/assets', express.static(path.join(__dirname, 'assets'), { maxAge: isDev ? 0 : '1y' }));
+
+// On-demand cover thumbnails: /media/thumb/<w>/<path> → a small lanczos-downscaled WebP
+// (cached on disk), so the browser doesn't jaggily shrink a high-res cover for the grid/
+// list. Mounted BEFORE the /media static so it catches the thumb path first.
+app.get('/media/thumb/:w/*', async (req, res) => {
+  const w = parseInt(req.params.w, 10);
+  const rel = req.params[0] || '';
+  if (!THUMB_SIZES.has(w)) return res.status(400).end();
+  let file = null;
+  try { file = await getThumbnail(rel, w); } catch { /* fall through to original */ }
+  if (!file) {
+    // Generation unavailable/failed → serve the original instead of 404'ing.
+    return res.redirect(302, '/media/' + rel.split('/').map(encodeURIComponent).join('/'));
+  }
+  res.setHeader('Cross-Origin-Resource-Policy', 'cross-origin');
+  res.setHeader('Cache-Control', isDev ? 'no-cache' : 'public, max-age=31536000, immutable');
+  res.type('webp');
+  res.sendFile(file);
+});
+
 app.use('/media', express.static(process.env.MEDIA_PATH || './storage/media', {
   // Public media (post covers, avatars) must be cross-origin embeddable by other