15
submitted 7 hours ago by fossil_dev@lemmy.ml to c/opensource@lemmy.ml

Standard web photo galleries lay out a wall of tags. So I wanted to see what happens if you treat the thumbnail grid like a sprite-rendered game scene instead i.e. pre-pack thumbnails into atlas pages at build time, then composite them with WebGL2 in the browser.

How it works: Build step (Node + Sharp, runs locally if needed). Scans a photo folder, generates four LOD levels per image (h50/h100/h200/h400), shelf-packs them into 2048×2048 AVIF sprite atlases, emits a binary layout index. Originals are copied byte-for-byte with content-hashed URLs so CDN edge caches survive rebuilds with unchanged photos.

Runtime (browser only, no server). Parses the binary index zero-copy as typed-array views, computes a justified grid, renders only the visible slice via WebGL2 instanced quads.

you are viewing a single comment's thread
view the rest of the comments
[-] fossil_dev@lemmy.ml 1 points 7 hours ago

The original idea is by Cartossin's GoodLibrary (https://lagbag.com/goodgallery/)

this post was submitted on 17 May 2026
15 points (100.0% liked)

Open Source

46880 readers
42 users here now

All about open source! Feel free to ask questions, and share news, and interesting stuff!

Useful Links

Rules

Related Communities

Community icon from opensource.org, but we are not affiliated with them.

founded 6 years ago
MODERATORS