const sharp = require('sharp');
const DEFAULTS = {
maxWidth: 1600,
maxHeight: 1600,
format: 'webp',
quality: 80
};
async function processImage(buffer, options = {}) {
const opts = { ...DEFAULTS, ...options };
const pipeline = sharp(buffer, { failOn: 'truncated' });
const metadata = await pipeline.metadata();
if (!metadata.format) {
throw new Error('Unsupported or unreadable image');
}
const output = await pipeline
.rotate() // apply EXIF orientation, then strip it
.resize(opts.maxWidth, opts.maxHeight, {
fit: 'inside',
withoutEnlargement: true
})
.toFormat(opts.format, { quality: opts.quality })
.toBuffer({ resolveWithObject: true });
return {
buffer: output.data,
width: output.info.width,
height: output.info.height,
format: opts.format,
bytes: output.info.size
};
}
module.exports = { processImage };
const multer = require('multer');
const ALLOWED = new Set(['image/jpeg', 'image/png', 'image/webp', 'image/gif']);
function fileFilter(req, file, cb) {
if (ALLOWED.has(file.mimetype)) {
cb(null, true);
} else {
cb(new Error('Only JPEG, PNG, WebP and GIF uploads are allowed'), false);
}
}
const upload = multer({
storage: multer.memoryStorage(),
fileFilter,
limits: {
fileSize: 10 * 1024 * 1024, // 10 MB ceiling before decoding
files: 1
}
});
module.exports = { upload };
const express = require('express');
const path = require('path');
const crypto = require('crypto');
const fs = require('fs/promises');
const { upload } = require('./upload');
const { processImage } = require('./imageProcessor');
const router = express.Router();
const UPLOAD_DIR = path.join(__dirname, '..', 'storage', 'images');
router.post('/images', upload.single('image'), async (req, res, next) => {
if (!req.file) {
return res.status(400).json({ error: 'No image file provided' });
}
let result;
try {
result = await processImage(req.file.buffer, { maxWidth: 1600, quality: 80 });
} catch (err) {
return res.status(422).json({ error: 'Could not process image', detail: err.message });
}
const filename = `${crypto.randomUUID()}.${result.format}`;
await fs.mkdir(UPLOAD_DIR, { recursive: true });
await fs.writeFile(path.join(UPLOAD_DIR, filename), result.buffer);
res.status(201).json({
url: `/images/${filename}`,
width: result.width,
height: result.height,
bytes: result.bytes
});
});
router.use((err, req, res, next) => {
if (err.code === 'LIMIT_FILE_SIZE') {
return res.status(413).json({ error: 'Image exceeds the 10 MB limit' });
}
return res.status(400).json({ error: err.message });
});
module.exports = router;
This snippet shows how an Express upload endpoint accepts a raw image, normalizes it, and writes a compressed, resized version to disk instead of storing the original bytes untouched. Storing whatever a client sends is a common source of bloat and abuse: a 12 MP phone photo can be 8 MB when a 1600px WebP at quality 80 would be a few hundred kilobytes. The transformation happens server-side so the stored asset is predictable regardless of what device or format the client used.
In imageProcessor.js, the work is centralized in processImage, which wraps the sharp library. The pipeline calls .rotate() first so EXIF orientation is baked in — otherwise portrait photos from phones render sideways. .resize() uses fit: 'inside' with withoutEnlargement: true, which shrinks oversized images to fit a bounding box but never upscales a small one, avoiding blurry blow-ups. It then re-encodes to a single canonical format (webp) with a fixed quality, and sharp metadata is read up front to reject non-images early. Returning both the buffer and its dimensions lets the caller persist useful metadata without re-parsing.
upload.js configures multer with memoryStorage so the file arrives as an in-memory Buffer rather than a temp file on disk. This matters because sharp reads a buffer directly, so the original is never persisted — only the processed output is. A fileFilter blocks obvious non-image MIME types, and limits.fileSize caps the request to prevent a single upload from exhausting memory; the two together form a cheap first line of defense before any expensive decoding runs.
uploadRoutes.js ties it together: the multer middleware populates req.file, processImage produces the optimized buffer, a collision-resistant name is built with crypto.randomUUID, and fs.writeFile commits it. Errors from sharp on a corrupt or truncated file surface as a 422 rather than a 500, and multer's LIMIT_FILE_SIZE is mapped to 413. The trade-off is CPU and event-loop time spent decoding on the request path; for high volume this belongs in a background job, but for typical avatar or attachment flows doing it inline keeps the design simple and the stored files consistently small.
Related snips
class SignupForm
include ActiveModel::Model
include ActiveModel::Attributes
attribute :account_name, :string
attribute :email, :stringShallow Controller, Deep Params: Form Object Pattern
# BAD: N+1 query problem
@users = User.all
@users.each do |user|
puts user.posts.count # Fires query for each user!
endActiveRecord query optimization and N+1 prevention
import { randomBytes, createHash } from "crypto";
import jwt from "jsonwebtoken";
import { RefreshTokenStore } from "./store";
const ACCESS_SECRET = process.env.ACCESS_SECRET!;
const ACCESS_TTL = "15m";JWT access + refresh token rotation (conceptual)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Form Validation Example</title>
<style>HTML forms with validation and accessibility
-- EXPLAIN ANALYZE (actual execution statistics)
EXPLAIN ANALYZE
SELECT u.username, COUNT(o.id) AS order_count
FROM users u
LEFT JOIN orders o ON u.id = o.user_id
WHERE u.created_at >= '2024-01-01'Advanced query optimization techniques
import cv2
image = cv2.imread('receipt.jpg')
gray = cv2.cvtColor(image, cv2.COLOR_BGR2GRAY)
blurred = cv2.GaussianBlur(gray, (5, 5), 0)
thresholded = cv2.adaptiveThreshold(OpenCV image preprocessing for OCR and vision pipelines
Share this code
Here's the card — post it anywhere.
