Web Standards

SVG filters guide: getting started with the basics. @anatudor@mastodon.social walks through the fundamentals of SVG filters, from setting up the <svg> and <filter> elements to understanding filter regions, primitive subregions, and color interpolation. The guide covers how primitives are chained, when to use result, in, and in2 attributes, and the difference between filterUnits and primitiveUnits for responsive effects. #svg #filter

https://frontendmasters.com/blog/svg-filters-guide-getting-started-with-the-basics/

CSS is DOOMed: rendering DOOM in 3D with CSS. @html5test@front-end.social built a version of the classic game where every visual element is a div positioned in 3D space using CSS transforms, with JavaScript handling only the game logic. The project uses CSS trigonometric functions, @​property for animatable custom properties, anchor positioning for HUD, and SVG filters for spectral enemies. #css #3d

https://nielsleenheer.com/articles/2026/css-is-doomed-rendering-doom-in-3d-with-css/

Dictionary compression is finally here, and it’s ridiculously good. @pimterry@toot.cafe explains how Compression Dictionary Transport works with Zstandard and Brotli over HTTP, using previous responses as dictionaries to compress data down to near-diffs. YouTube JS bundles shrink up to 90% vs plain Brotli, Google Search HTML nearly 50%. Already deployed by Google, Shopify, Pinterest, and Notion. Chrome 130+, Safari and Firefox on the way. #performance #http

https://httptoolkit.com/blog/dictionary-compression-performance-zstd-brotli/

Sprites on the web. @joshwcomeau@front-end.social shows how to animate spritesheets in CSS within the <img> viewport: object-fit, object-position, and steps(jump-none) for clean frame-by-frame motion, plus when sprites beat GIFs, and when procedural animation is better. #css #animation

https://www.joshwcomeau.com/animation/sprites/

A production-ready web component starter template. @Aaron@front-end.social presents a GitHub template with a setup wizard, flexible import options, Vitest and Happy DOM testing, ESLint and Prettier, GitHub Actions CI, and secure npm publishing, plus docs on custom element best practices. #webcomponents #js #tools

https://www.aaron-gustafson.com/notebook/a-web-component-starter-template/

Introducing CSS grid lanes. The @webkit@front-end.social team announced the next major step in web layouts: CSS grid lanes bring masonry-style layouts to the web. With the first implementation available now in Safari Technology Preview 234, it enables flexible and accessible content and UI designs without JavaScript. It uses the new item-tolerance CSS property and leverages full CSS grid power. #css #layout

https://webkit.org/blog/17660/introducing-css-grid-lanes/