Accessibility
Don't put aria-label on generic elements like divs
The title already tells most of the story, but here's why you must avoid labeling generic elements like divs or spans using aria-label or aria-labelledby.
Session Timeouts: The Overlooked Accessibility Barrier In Authentication Design
Poorly handled session timeouts are more than a technical inconvenience. They can become serious accessibility barriers that interrupt essential online tasks, especially for people with disabilities. Here is how to implement thoughtful session management that improves usability, reduces frustration, and helps create a more accessible and respectful web.
CSS
The State of CSS Centering in 2026
Despite the countless number of online resources, it’s easy to get confused when trying to center an element. There are documented solutions, but do you really understand why the code you picked works? Let's look at the current state of centering options today in 2026.
Connecting Circles With a Curved Line
Using border-shape and anchor positioning to create a connection between two circles.
How to Control Infinite CSS Animations (Part 2 of 2)
This time, we will see how to start/stop infinite animations smoothly. The goal is to make the effect look natural and realistic. As in the previous article, we will study the effects using rotation and then explore additional examples.
Advanced Tree Counting: Mathematical Layouts With sibling-index() And sibling-count()
Meet sibling-index() and sibling-count(). Staggered cascade effect in one line of CSS without :nth-child() rules or JS workarounds. Works for 5 items or 5,000.
PolyCSS - CSS 3D Engine for the DOM
Render solid and textured 3D meshes in the DOM without WebGL. Each polygon is a real element you can style, click, and inspect. Supports OBJ/MTL, GLB and VOX.
In Defense of Functional CSS
No CSS methodology eliminates technical debt. Bad Functional CSS exists. Bad BEM exists. Bad everything exists. Give a team enough pressure, unclear requirements, and no review process, and they can turn any methodology into a crime scene. The question is not whether Functional CSS prevents all technical debt. It does not. The better question is: which methodology makes technical debt easier to see, easier to limit, and easier to fix?
Bending a Straight Line using Modern CSS
Using border-shape and anchor positioning to create a bending line between two circles.
Cross-Document View Transitions: Scaling Across Hundreds of Elements
Every view-transition-name on a page must be unique. The problem is that every pseudo-element selector in your CSS targets a specific name, so your animation styles explode into an unmanageable wall of selectors.
JavaScript
Google Introduces HTML-in-Canvas API: Accessible UI Meets WebGL / WebGPU
At Google I/O 2026, Chrome engineer Thomas Nattestad unveiled the HTML-in-Canvas API, which is a new web platform feature that lets developers render HTML elements directly into canvas, WebGL, and WebGPU contexts while preserving accessibility and interactivity.
State.js - a lightweight CSS frontend framework that exposes DOM element states as CSS variables for data-driven animations and reactive UIs. Build dynamic, interactive interfaces using pure CSS and HTML
State.js is a super simple, efficient and lightweight CSS framework that exposes DOM element states as CSS variables. Track data attributes, form inputs, media playback, and element visibility - all automatically exposed for use in your CSS animations and transitions.
A CSS-first approach to reactive interfaces.
gameplate - The 3 KB TypeScript game framework. Zero deps. Any renderer
- 3 KB gzipped. Smaller than a single sprite sheet. Zero runtime deps. Forever.
- TypeScript-first.
strict: true+ everynoUnchecked*flag. Inference does the work — noas any, ever. - Renderer-agnostic. Canvas · WebGL · WebGPU · PIXI · Three.js · DOM · terminal. Pick one. Switch tomorrow.
- Deterministic loop. Variable timestep by default; opt into fixed-step + interpolation when physics need to be reproducible.
- Input, normalized. Keyboard + pointer with target-relative coords. Headless no-ops cleanly — same API on Node.
- Typed scene FSM.
menu → start → playingwith compile-time checks. Send a wrong event? TypeScript stops you. - Memoized selectors. Reselect-style derived state, ~30 LOC, exact same shape.
- Browser & Node. Headless simulation, server-authoritative play, CI snapshot tests — same code, two runtimes.
- Dual ESM + CJS.
publintclean. Provenance signed. Tree-shakeable.
LittleJS Games
A collection of retro arcade games with the LittleJS HTML5 engine. Play instantly in your browser — no installs, fully open-source.
LittleJS: Tiny fast HTML5 game engine with many features and no dependencies
LittleJS is a fast, lightweight, and fully open source HTML5 game engine designed for simplicity and performance. Its small footprint is packed with a comprehensive feature set including rendering, physics, particles, sound, and input handling. The code is very clean and well documented with many examples to get you started quickly.
Front-end, regrounded: Why Wraplet might be what you’re missing
Wraplet is a small TypeScript framework that wraps real DOM nodes with real classes, gives them a predictable lifecycle, and lets you wire them together with typed, declarative dependencies.
That is essentially all it does, and most of the time, that is all you actually need – unless you are building a full SPA, and even then, you can get surprisingly far with Wraplet alone.
What follows is a short tour of why that turn might be worth taking.