Overview
I built PixelWand because every free image optimizer online either destroyed quality or capped batch size. The core is an SSIM binary search that steps quality down until the output hits a structural-similarity threshold, then stops. Sharp handles conversions to WebP, AVIF, and PNG. Uploads stream browser-to-R2 via presigned URLs so the server never touches raw bytes. Stripe runs billing, Upstash Redis enforces the free-tier cap with a Postgres fallback, and NextAuth handles sessions.
Built With
Architecture
Code
// Binary-search the smallest file that still hits the SSIM target.
export async function compressToSsim(
input: Buffer,
format: Format,
targetSsim = 0.985,
) {
let lo = 40;
let hi = 95;
let best: { buffer: Buffer; quality: number } | null = null;
while (lo <= hi) {
const quality = Math.round((lo + hi) / 2);
const output = await sharp(input).toFormat(format, { quality }).toBuffer();
const ssim = await computeSsim(input, output);
if (ssim >= targetSsim) {
best = { buffer: output, quality };
hi = quality - 1; // try an even smaller file
} else {
lo = quality + 1; // need more quality to clear the threshold
}
}
return best ?? fallbackEncode(input, format);
}The core of PixelWand. Steps quality down until SSIM drops below the perceptual threshold, then stops.
Key Highlights
SaaS Billing
The platform includes full Stripe integration with tiered subscriptions and usage-based billing.
Rate Limiting
Rate limiting uses a dual-layer approach with Upstash Redis as primary and Postgres as fallback, enforcing 3 free conversions per day.
Serverless Uploads
Files upload directly to Cloudflare R2 via presigned URLs, eliminating server-side file handling.
SSIM Compression
A binary-search algorithm iterates compression levels to hit the target SSIM score with minimal file size.
Production CI/CD
The app is deployed on Vercel with automated builds, type checking, and monitoring.