Why GitHub now ships more CSS, not less

Improving Site Performance by Shipping More CSS — GitHub details how it spent three years purging styled-components and 'CSS-in-JS' from github․com in favor of CSS Modules. The result? Shipping more CSS, but GitHub reports 55% less time to server-side render a page.

Josh Black and Marie Lucca (GitHub)

💡 CSS Modules isn't a browser feature or standard, but a widely supported bundler convention where classes in a .module.css file get rewritten to unique names, scoping styles per file with no runtime cost.

Reports That Time Out Aren't a Frontend Bug — The report worked in testing. In production, it scans months of rows and times out before it renders. That's not a frontend bug, it's the query behind it. TimescaleDB extends Postgres so that query returns fast at scale. Get $1000 credit to start.

Tiger Data (creators of TimescaleDB) sponsor

EmDash 1.0: An Open Source CMS for Astro — Cloudflare's alternative to WordPress, first announced in April, has reached 1.0. Each site ships with an MCP server, meaning you can set an agent to work out of the box. To accompany the launch, plugins can now be submitted to its registry.

Matt Kane

How Anthropic Made Claude's Web App Faster — The tale of how a recent sprint (with Claude doing much of the work) cut Claude's time-to-typeable at the 75th percentile from 3.1s to 0.55s, from tracking layout shifts too small for CLS to flag, to a :root:has() selector costing 24ms per DOM change, and a jump caused by Chrome pre-rendering the page at the wrong height.

Wang, Attard, and G (Anthropic)

📙 Articles, Opinions & Tutorials

Detect When Elements Overlap with CSS — A neat bit of CSS lateral thinking to detect when two elements get too close or overlap, no JavaScript needed. It combines anchor positioning, style container queries, and scroll-driven animations, using an overflowing 'measure' element as the trigger.

Ahmad Shadeed

Connection Allowlists: Lock Down Where a Page Can Connect — Chrome 152 adds support for a Connection-Allowlist header to tell the browser which servers a page is allowed to talk to (and block everything else).

Benz & Zapata (Chrome for Developers)

The Future of Frontend Is Agentic: Free OpenAI Course — Join OpenAI's Katia Gil Guzman and learn how to direct Codex through landing pages, dashboards, 3D interfaces, and shipping into an existing codebase.

Master.dev sponsor

Which Features Should Browsers Fix Together in 2027? — Ollie shares what features he believes the web platform should focus on next year, including the Sanitizer API, focusgroup, and grid-lanes, along with what early-stage things should be in consideration for the future.

Ollie Williams

Extracting Grid Information Using CSS — A neat CSS-only proof of concept technique where you can get information about a grid structure (number of columns/rows, where items sit on the grid, etc). The technique relies on scroll-driven animations, oddly enough.

Temani Afif

The Interface Cheat Sheet — A helpful illustrated list of good UI advice, touching on points from border radiuses and transitions to the use of color, scaling and accessibility.

Jakub Krehel

The Era of Agentic Mobile Development Is Built on Expo — Build with our CLI and dev tools. Test on our cloud simulators. And ship with the best CI/CD for mobile development.

Expo sponsor

Custom Attributes Polyfill — A polyfill for the proposed Custom Attributes spec, letting you attach reusable behaviours to any element via custom attributes with their own lifecycle hooks.

Keith Cirkel

Fluid Typography — Donnie argues that because container widths are unpredictable, using container queries to drive fluid font sizing isn't the right choice. He suggests we stick with viewport units to retain true control.

Donnie D’Amato

Stop Buttons Triggering Zoom When They’re Double Tapped
Andy Bell

Stop Treating CSS Container Queries Like Traditional Media Queries
Victor Ayomipo

Component Testing: A Practical Guide for Frontend Developers
Storybook Blog

🧰 Tools, Code & Resources

Transitions.dev: Essential UI Transitions for Web Apps — The home page shows a series of cards, each of which displays a CSS-based UI animation. You can also install the set as an agent skill for your AI coding tool. Some of the transitions are part of a "Pro" plan. Source code.

Jakub Antalik

Markuplint 5.0: An HTML Linter for All Markup Developers — This well-established linter recently hit version 5. The repo is here, and you can see things in action in the playground.

Yusuke Hirao

Make Your Logo Brighter Than White — If you've got an HDR display, this browser-based tool will quickly make its trick clear. Drop in your logo, choose which colors should glow, and get an HDR version ready to download. Claims to make things up to 7.5x brighter in Chrome and Safari.

Chris Bennett

🔊 soundcn: A Curated Collection of Sound Effects for Modern Web Apps — A comprehensive set of 800+ sounds that's installable via the shadcn registry. You can browse them by category and test each one by hovering over its card. Pay attention to the licenses of sounds you use. GitHub repo.

Kapish Dima

🙈 ...and finally

Here's a kinda crude font foundry that takes two web fonts and mixes their glyphs, with unsettling results. I mean, why not make a Times New Roman/Comic Sans hybrid to catch folks off guard? And, yes, you can download the end result.