How Appleโs Key Tactic Could Prevent Japanโs Smartphone Act from Improving Browser Competition open-web-advocacy.org/blog/how_app... by your chums from @open-web-advocacy.org
"The <time> element should actually do something" by Nolan Lawson
nolanlawson.com/2025/12/14/t...
Reminds me of the the recent session on @tantek.com.web.brid.gy's proposed <amount> at tpac. Maybe moz would experiment
ไผ็คพใฎAdvent Calendarใฎใใใขใฏใปใทใใชใใฃใฎๅคงๅใใ่ใๆนใซใคใใฆใฎ่จไบใๆ็จฟใใพใใ
ใใใฃใใ่ชญใใงใฟใฆใใ ใใ
#a11y
qiita.com/alangdm/item...
Made a new Web Component: RichInput. It's a drop-in replacement for text-based <input> elements that can colourise user input.
A "stylepattern" attribute accepts a regex pattern and the resulting capture groups can be styled using CSS `::part(group-n)`
keithclark.github.io/richinput/
We've been working hard at getting the new prettier cli released for some months now, and here it is! Huge speed ups and such a great collab between @e18e.dev and the prettier team ๐ฉต big thanks to @fabiospampinato.bsky.social leading this!
The one where I muse about how this simple bit of code radically changes how the web itself seems to behaveโฆ
webkit.org/blog/16967/t...
Happy *Publish All NPM Packages as Standard JS Modules Only Day* to all who celebrate! ๐
All supported versions of Node now support require() of standard JS modules, aka require(esm).
So add type: "module" to your package.json, simplify your build, and spark some joy!
nodejs.org/en/about/pre...
I'm optimistic that the next 12 months is going to a very special time for JS performance โก
(This applies to developer workflows & end-users.)
Several large-scale independent multi-year language, runtime, tooling, & library investments are approaching the payback stage all around the same time.
Screenshot of CSS Form Control Styling Level 1 First Public Working Draft web standard from the W3C's CSS Working Group
There it is! Finally, a real solution for how to style all of the HTML form controls using your own custom CSS to change anything โย building on an interoperable UA set of defaults.
First, styling the in-page part of controls + the popover for <select>. (Later weโll do popovers for more things.)
in the @e18e.dev community, we've been hard at work helping migrate packages to ES modules recently. have a read about it in the new blog post!
โYou can't say it any nicer: You can only write stable, well-performing React code if you have a team of exclusively experienced React developers.โ
blog.lusito.info/stop-using-a...
I've used GitHub projects for my job's GHE instance and it works surprisingly good!
Especially since in the modern ones you have the Kanban and the table views, the charts, iterations, and a few other things
Home Assistant made a technical decision almost a decade ago that lasted ๐คฏ
They are supported!
Fitbit and Pixel watches are too
www.pokemonsleep.net/devices/
๐ ESLint now officially supports linting CSS!
Read more:
eslint.org/blog/2025/02...
some thoughts on bundling dependencies in libraries and dev tools. especially given the great effort from the community lately, we need to bundle less and less (in consumed packages)
๐ ๐ style-observer: A robust solution for observing CSS property changes in JS.
Developed with @d12n.meโs help over the last month.
Made possible by the pioneering work of @bram.us, Artem Godin, @janeori.propjockey.io and many others!
Blog post: lea.verou.me/blog/2025/st...
Docs: observe.style
`require(esm)` got backported to Node 20! ๐
When Node 18 hits EOL in less than 3 months, we can finally drop CJS builds and go ESM-only
<table> highlighting with CSS :has() ๐ก
td:has(~ td:hover), /* previous sibling cells */
table:has(td:nth-of-type(3):hover) /* column cells */
tr:not(:first-of-type):has(~ tr:hover)
td:nth-of-type(3) {
background: var(--highlighted);
}
A table that gives ideal versus actual page size and JavaScript size: The ideal JS weight is under 365 kilobytes. The actual median JS weight is 650 kilobytes. The actual JS weight at the 90th percentile is 1825 kilobytes. The ideal total page weight is under 1.4 megabytes. The actual median page weight is 2.6 megabytes. The actual JS weight at the 90th percentile is 11.1 megabytes.
I recently published my annual dive into the
@httparchive.org, focusing on page growth, #webperf and #ux:
www.speedcurve.com/blog/page-bl...
A common question is "How big SHOULD my pages be?" According to analysis by @infrequently.org, the ideal page should be <1.4 MB with <365 KB coming from JS.
New blog post! Let's move to ESM! ๐
๐
antfu.me/posts/move-o...
Preact is truly amazing.
Same React app. One is bundled as is.
Another uses preact/compat to alias React imports and swaps in Preact under the hood.
Bundle size (gzip):
React: ~140KB
Preact: ~8KB
All of this by just changing a few lines and installing a couple of packages.
premium segment phones make up a tiny fraction of the overall smartphone market. *MOST* devices cost *much* less than $350 (new, unlocked), which is $85 less than the cheapest new iPhone you can buy.
Single-core CPU performance continues to be abysmal in the Android ecosystem. And it's worse than even this looks because *most* phones are more than 2 years old.
Cannot emphasise enough how out of touch web developers have become. The blue dotted line in this chart is worldwide average selling price for smartphones over the past decade, and the second chart is CPU performance.
Written a little about the journey to @e18e.dev and what's ahead for the community in 2025. I'm so happy to see how many great minds have been connected, and the awesome projects they're working on ๐ฉต
Good writeup from @css-tricks.com on the situation with "Masonry"โ and whether it belongs as part of grid or its own `display` type. It's largely neck-and-neck and won't move unless some minds on either side change.
css-tricks.com/csswg-minute...
โ Still a bad name.
๐ New post!
`aria-label` and `aria-labelledby` aren't allowed on divs, spans, and other static text elements out of the box, and *most* screenreaders won't announce them.
#accessibility #a11y
I've come to understand what's happening in frontend's decade-long failure to deliver decent user experiences as a sort of epistemic closure. I'm calling it "frameworkism", and the epicenter is now React. Here's a lot of words on why we should all reject it:
infrequently.org/2024/11/if-not-rโฆ
Implemented scoped custom element registry in WebKit: commits.webkit.org/286828@main
We now have two interoperable implementations!
Take this `<dialog>` too
classic; cart in the top right, pushes the whole page left to reveal your cart sidenav
nerdy.dev/have-a-dialog #CSS
This is the way (for most sites):
gov.uk/service-manual/tโฆ
