JPEG lab: overview screen and picture gallery

[benjamin-small]

The JPEG lab now opens on an overview: one picture before and after JPEG, how much smaller the file got, and three byte histograms that show where the redundancy is. Behind it is a gallery of eleven pictures. Design: docs/superpowers/specs/2026-10-16-jpeg-lab-gallery-design.md. Plan: docs/superpowers/plans/2026-10-16-jpeg-lab-4-gallery.md.

What's in it

• 0 · Overview (the new default stage):
  • The original and the JPEG side by side, with size bars and the ratio.
  • Histograms of the raw bytes, the neighbour differences and the JPEG file, each with its Shannon entropy. For the default picture they read 7.77, 5.66 and 7.95 bits/byte.
  • The picture's credit.
• Gallery of eleven pictures, with Grand Prismatic Spring as the new default:
  • Photos: Grand Prismatic Spring (NPS), Atlantis STS-135 (NASA).
  • Memes: Doge (CC0 recreation), Honest work (public domain), and an original "Needs more JPEG" cartoon.
  • Maths, generated in Rust:
    • Made of cosines: 2.4 KB.
    • The same cosines shifted 4 px: 16.6 KB.
    • Pure noise: about 12 dB PSNR at every quality.
  • Artifact tests: the existing gradient, text and bars.
• Picture select: a grouped dropdown in the bezel replaces the image buttons.
• Bundled files: the PNGs live under web/public/jpeg/ with CREDITS.md, and the scripts that regenerate them byte-for-byte are in scripts/jpeg-gallery/.
• First load: the stage stays blank until the first picture arrives, and the first picture's fetch overlaps the WASM load. If the first picture fails to load, the lab falls back to the gradient and shows an alert.

Tests

• cargo test: 85 + 315
• wasm-pack in headless Chrome: 49
• vitest: 574 in 40 files
• svelte-check: 0 errors
• A real-browser check of all eleven pictures
• A Playwright overlap check at 375, 800 and 1440 px

Review

• Per-task reviews: Task 4 and the final wave each needed one fix round, and Task 5 needed two (phone layout).
• Opus final review: "with fixes". One fix wave closed all 12 items.
• Parked: an uploaded picture's link writes img=gradient. Minor test gaps are noted for the next plan.