// the find
chenglou/chenglou.github.io
Chen Lou's personal Midjourney art gallery, deployed to GitHub Pages, built to show interaction and animation details from a tweet. It is most useful as a readable reference for hand-rolled, dependency-free gallery code with careful animation and hit-area handling, not as a library to drop into a project.
- The render loop is written out as a fixed sequence: batched DOM reads, state changes, layout, animation tick, then batched DOM writes, with only events and the final step able to schedule the next frame. That ordering is the part worth copying.
- Line-mode hit areas extend to the window edges and stay put during transitions. That fixes the usual misclick-dismiss problem on thin images, and it is a concrete fix rather than a visual flourish.
- Framerate-decoupled animation and occlusion culling match the stated goals. Transitions stay on time when frames drop, and only visible items are in the DOM.
- Area-based sizing is a sensible correction to width-based responsive grids: square images get shrunk and tall ones grown so they carry similar visual weight.
- The README itself says progressive image loading 'could be done better', and this is a gallery of large images, so slow connections will feel it first.
- Most features are shown through YouTube links and screenshots. The listed tree has no test files, so claims like frame stepping and resize anchoring can only be checked by running the page.
- The photo list is hardcoded in data.ts and the layout code is tuned to this one site. Reusing it means rewriting the data and layout layers together.
- Setup needs Bun and a typecheck toolchain. The architecture section is a sketch, so the real event wiring has to be read in index.ts before the 'no hidden control flow' claim can be trusted.