Tag: Vanilla JS
-
List Virtualization: How to Render 100,000 Rows Without Killing Your Browser
List virtualization (also called virtual scrolling or windowing) renders only the rows currently visible on screen as real DOM elements — typically 15–20 nodes, regardless of list size. As the user scrolls, those same nodes are repositioned and filled with new data, instead of creating thousands of new elements. The result: a 100,000-row list with the same DOM cost as a 15-row list.
-
I Built a Cultural RPG in a Single HTML File — Here’s What Broke
A developer devlog on building cultural RPG, a browser-based Malaysian multicultural RPG — covering canvas HiDPI scaling, replacing emoji with vector graphics, NPC dialogue, localStorage saves, and every bug that nearly broke it.
-
The ResizeObserver API: A Practical Guide for Frontend Developers
What is the ResizeObserver API and how do you use it? A practical guide covering borderBoxSize, contentBoxSize, inlineSize, blockSize, observing multiple elements, and real-world use cases — with a live interactive demo.