Benchmarking Image Processing Pipelines for Edge-Hosted Responsive Web Interfaces

Responsive web interfaces often require multiple renditions of each source image to support display across desktop, tablet, and smartphone clients. The source image loading method used in rendition generation can significantly affect processing time and resource usage, particularly on resource-constrained hardware. This study benchmarks six PHP/Imagick pipelines on a Raspberry Pi 4 Model B, differing in how the source JPEG is loaded and used to generate six renditions. The pipelines range from a baseline that decodes the full-resolution source image for each rendition to strategies combining Discrete Cosine Transform (DCT)-domain downsampling with in-memory cloning or memory-mapped Magick Pixel Cache (MPC) files. Each pipeline was evaluated on 12 high-resolution source images, with every image processed over 10 rounds, measuring execution time, CPU utilization, peak memory usage (resident set size, RSS), and CPU temperature. Computational cost was expressed as total CPU time. Output quality was assessed using Structural Similarity Index Measure (SSIM) and Learned Perceptual Image Patch Similarity (LPIPS) metrics, comparing renditions from each optimized pipeline against those produced by the baseline. Pipelines combining DCT-domain downsampling with a single-decode strategy achieved an approximately 4× speedup and more than 62% lower peak RSS than the baseline, while producing renditions with LPIPS values below 0.05 and SSIM values above 0.95 for every tested image. Across all DCT-based pipelines, SSIM fell below 0.95 in only three observations, all from a single structurally complex source image. The presented strategies require minimal implementation effort and deliver significant gains on resource-constrained hardware.