Image Load Lab — PNG versus WebP transparency benchmark

Run date: 2026-08-12
Fixture: original deterministic SVG seed 20260812, rendered to 1280 × 800 RGBA PNG
Environment: Node.js v24.14.0; Sharp 0.34.5; libvips 8.17.3; PNG 1.6.50; WebP 1.6.0

Method
1. Render one transparent fixture containing hard edges, partial alpha, soft fades, overlapping colors, one-pixel lines and semi-transparent text.
2. Encode PNG, lossless WebP, and lossy WebP Q80 with alphaQuality 100.
3. Decode each output to RGBA and compare the alpha channel with the source.
4. Composite source and outputs over white, dark, saturated green and saturated orange backgrounds.
5. Report RGB PSNR for each composited surface and inspect the provided HTML/figure. Metrics are proxies, not perceptual verdicts.

Limitations
- The fixture is synthetic and does not cover photographic cut-outs, indexed PNG palettes, animation, alternate resize filters, color profiles or every browser compositor.
- PSNR can miss localized halos and perceptual color shifts. Inspect the files at the delivered size on the real page background.
