image compression

server.js

@@ -3,12 +3,19 @@ import { WebSocketServer } from "ws";
 import { readFileSync, mkdirSync, writeFileSync } from "fs";
 import { join as joinPath } from "path";
 import matter from "gray-matter";
+import sharp from "sharp";
 
 import { renderFile } from "./group-similar.js";
 
 const MD_ROOT_DIR = "docs";
 const IMG_ROOT_DIR = "docs/public/images";
 
+const MAX_W = 800;
+const MAX_H = 600;
+
+const FORMAT = "webp";
+const WEBP_QUALITY = 75; // tweak 60-85 if you want smaller/larger
+
 const PORT = 8080;
 const wss = new WebSocketServer({ port: PORT });
 
@@ -21,7 +28,19 @@ wss.on("connection", (ws) => {
 
   ws.on("message", (message, isBinary) => {
     if (message instanceof Buffer && isBinary) {
-      writeFileSync(joinPath(IMG_ROOT_DIR, filename), message);
+      sharp(message)
+        .rotate() // respects EXIF orientation
+        .resize({
+          width: MAX_W,
+          height: MAX_H,
+          fit: "inside", // preserve aspect, fit within box
+          withoutEnlargement: true, // don't upscale small images
+        })
+        .toFormat(FORMAT, {
+          quality: WEBP_QUALITY,
+          effort: 4,
+        })
+        .toFile(joinPath(IMG_ROOT_DIR, filename));
 
       return;
     }