Technical notes on web development, DevOps, and AI integration.
1 article
How I cut one client-logo wall raster into 113 uniform tiles: whitespace segmentation, a 220x130 canvas, and a stable next/image grid.
TL;DR: A single giant client-logo raster gets split deterministically using whitespace projection and connected components, no machine learning needed. Each crop is normalized onto a 220x130 white canvas so the grid stays tidy without stretching. The frontend uses next/image with explicit dimensions, lazy loading, and slot-based naming to prevent layout shift and keep pruning safe.