Jake Archibald
@jakearchibald.com
Developer of sorts at @firefox.com. No thought goes unpublished. He/him.
Pinned
Jake Archibald
@jakearchibald.com
· Jun 17
Animating zooming using CSS: transform order is important… sometimes
How to get the right transform animation.
jakearchibald.com
CSS uses a complex algorithm to decide how to animate transforms. If you get it wrong, as many folks do, you end up with an unnatural animation.
Here's how it works, and how to avoid the pitfalls.
jakearchibald.com/2025/animati...
Here's how it works, and how to avoid the pitfalls.
jakearchibald.com/2025/animati...
Just overheard this in Pizza Express:
Her: Do you have a red?
Waiter: We have a Malbec, Chianti…
Her: sorry i meant crayons
Her: Do you have a red?
Waiter: We have a Malbec, Chianti…
Her: sorry i meant crayons
November 24, 2025 at 5:14 PM
Just overheard this in Pizza Express:
Her: Do you have a red?
Waiter: We have a Malbec, Chianti…
Her: sorry i meant crayons
Her: Do you have a red?
Waiter: We have a Malbec, Chianti…
Her: sorry i meant crayons
Reposted by Jake Archibald
Out-of-order HTML patching, another proposal from TPAC, lets HTML be presented non-linearly, and a single file can update multiple parts of the page.
Would this feature be useful to you?
Would this feature be useful to you?
November 19, 2025 at 4:10 PM
Out-of-order HTML patching, another proposal from TPAC, lets HTML be presented non-linearly, and a single file can update multiple parts of the page.
Would this feature be useful to you?
Would this feature be useful to you?
Reposted by Jake Archibald
I'm experimenting with this format. Is it… good? Like, should I do more of this kind of thing? Critical feedback welcome!
streamHTMLUnsafe() was presented at TPAC last week. Finally, an API that lets you easily use the streaming HTML parser from JavaScript! Here's a quick overview:
November 19, 2025 at 12:01 AM
I'm experimenting with this format. Is it… good? Like, should I do more of this kind of thing? Critical feedback welcome!
Reposted by Jake Archibald
ECMAScript excitement 😉
Congrats to my coworker @ashley-c.bsky.social at TechAtBloomberg on advancing Await Dictionary to Stage 2.7 at TC39 today 🎉
Promise.all returns positional results as an array. Promise.allKeyed allows named results inside an object 👍
github.com/tc39/proposa...
Congrats to my coworker @ashley-c.bsky.social at TechAtBloomberg on advancing Await Dictionary to Stage 2.7 at TC39 today 🎉
Promise.all returns positional results as an array. Promise.allKeyed allows named results inside an object 👍
github.com/tc39/proposa...
November 18, 2025 at 6:33 AM
ECMAScript excitement 😉
Congrats to my coworker @ashley-c.bsky.social at TechAtBloomberg on advancing Await Dictionary to Stage 2.7 at TC39 today 🎉
Promise.all returns positional results as an array. Promise.allKeyed allows named results inside an object 👍
github.com/tc39/proposa...
Congrats to my coworker @ashley-c.bsky.social at TechAtBloomberg on advancing Await Dictionary to Stage 2.7 at TC39 today 🎉
Promise.all returns positional results as an array. Promise.allKeyed allows named results inside an object 👍
github.com/tc39/proposa...
Reposted by Jake Archibald
New blog post: “Faking Two-Phase View Transitions with the Navigation API’s precommitHandler”
www.bram.us/2025/11/17/f...
By using two View Transitions when intercepting links with the Navigation API – one in the precommitHandler and one in the regular handler – you can fake a Two-Phase VT today!
www.bram.us/2025/11/17/f...
By using two View Transitions when intercepting links with the Navigation API – one in the precommitHandler and one in the regular handler – you can fake a Two-Phase VT today!
Faking Two-Phase View Transitions with the Navigation API’s precommitHandler
By using two sequential View Transitions when intercepting links with the Navigation API – one in the precommitHandler and one in the regular handler – you can fake a Two-Phase View Transition today!
www.bram.us
November 17, 2025 at 10:14 PM
New blog post: “Faking Two-Phase View Transitions with the Navigation API’s precommitHandler”
www.bram.us/2025/11/17/f...
By using two View Transitions when intercepting links with the Navigation API – one in the precommitHandler and one in the regular handler – you can fake a Two-Phase VT today!
www.bram.us/2025/11/17/f...
By using two View Transitions when intercepting links with the Navigation API – one in the precommitHandler and one in the regular handler – you can fake a Two-Phase VT today!
Reposted by Jake Archibald
Two-phase view transitions, for faster cross-document transitions, were presented at TPAC last week. Here's a quick 3min overview…
https://www.youtube.com/watch?v=A6rO9RGmJgA
https://www.youtube.com/watch?v=A6rO9RGmJgA
Two-phase view transitions
YouTube video by Jake Archibald
www.youtube.com
November 17, 2025 at 3:50 PM
Two-phase view transitions, for faster cross-document transitions, were presented at TPAC last week. Here's a quick 3min overview…
https://www.youtube.com/watch?v=A6rO9RGmJgA
https://www.youtube.com/watch?v=A6rO9RGmJgA
Reposted by Jake Archibald
The W3C Security Web Application Guidelines Community Group wants to understand how developers are using specific web platform security features, and what the barriers are to the adoption.
Take their survey here: https://bit.ly/3JR6JML
Take their survey here: https://bit.ly/3JR6JML
Web security survey
Thanks for taking our survey about the usage of web platform security features.
We're the W3C Security Web Application Guidelines Community Group (SWAG CG), and our mission is to develop guidelines f...
docs.google.com
November 13, 2025 at 4:46 PM
The W3C Security Web Application Guidelines Community Group wants to understand how developers are using specific web platform security features, and what the barriers are to the adoption.
Take their survey here: https://bit.ly/3JR6JML
Take their survey here: https://bit.ly/3JR6JML
Reposted by Jake Archibald
It's a wrap! I did five runs of this talk so it's time to overshare on my blog, as usual.
🤍 ohhelloana.blog/css-talk-fin...
🤍 ohhelloana.blog/css-talk-fin...
Talking around about CSS: The final act
It's a wrap! Now it's time to talk about all the feelings I had in the process.
ohhelloana.blog
November 11, 2025 at 10:02 AM
It's a wrap! I did five runs of this talk so it's time to overshare on my blog, as usual.
🤍 ohhelloana.blog/css-talk-fin...
🤍 ohhelloana.blog/css-talk-fin...
Reposted by Jake Archibald
The @firefoxdevtools.bsky.social JSON viewer got better in @firefoxnightly.bsky.social : the console offers access to the original json data via `$json`.
This allows to easily manipulate the underlying data to get what you want
This allows to easily manipulate the underlying data to get what you want
![Firefox JSON Viewer opened for the html entites JSON file
We can see the various properties of the JSON file, which are all objects containing a "characters" and a "codepoints" properties.
The Console is opened at the bottom. In it, we can see a console message explaining that some data is available (`$json.data` - the parsed JSON object, $json.text` - the original JSON text and `$json.headers` - HTTP request and response headers)
There's a console evaluation done with the following snippet:
```js
Object.entries($json.data)
.filter(([k, v]) => v.codepoints.length > 1)
.map(([k, v]) => ({characters: v.characters, htmlEntity: k, codepoints: v.codepoints}))
```
and the result shows an array of objects containing "characters", "htmlEntity" and "codepoints" properties.](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:l6jizqbrtfnhnrd7vmsqmi3n/bafkreigizqr72frwj6qa53onh2tskqmcmrydexkzeydrkrarwiuoyulcmq@jpeg)
November 7, 2025 at 11:40 AM
The @firefoxdevtools.bsky.social JSON viewer got better in @firefoxnightly.bsky.social : the console offers access to the original json data via `$json`.
This allows to easily manipulate the underlying data to get what you want
This allows to easily manipulate the underlying data to get what you want
Great, so www.britishairways.com
🎉 Displays in geo language rather than user language
🎉 The language picker is at the bottom of a long page
🎉 The language picker is in the current language, so in order to select "United Kingdom", I need to know what that is in German
🎉 Displays in geo language rather than user language
🎉 The language picker is at the bottom of a long page
🎉 The language picker is in the current language, so in order to select "United Kingdom", I need to know what that is in German
November 7, 2025 at 11:03 AM
Great, so www.britishairways.com
🎉 Displays in geo language rather than user language
🎉 The language picker is at the bottom of a long page
🎉 The language picker is in the current language, so in order to select "United Kingdom", I need to know what that is in German
🎉 Displays in geo language rather than user language
🎉 The language picker is at the bottom of a long page
🎉 The language picker is in the current language, so in order to select "United Kingdom", I need to know what that is in German
I tried to AI code some in-browser video decoding stuff. It made a mess.
So I learned the APIs somewhat properly, and did a much better job, but it was still messy.
Then I found mediabunny.dev and it just worked. Yay!
So I learned the APIs somewhat properly, and did a much better job, but it was still messy.
Then I found mediabunny.dev and it just worked. Yay!
Mediabunny
A JavaScript library for reading, writing, and converting media files. Directly in the browser, and faster than anybunny else.
mediabunny.dev
October 30, 2025 at 10:35 AM
I tried to AI code some in-browser video decoding stuff. It made a mess.
So I learned the APIs somewhat properly, and did a much better job, but it was still messy.
Then I found mediabunny.dev and it just worked. Yay!
So I learned the APIs somewhat properly, and did a much better job, but it was still messy.
Then I found mediabunny.dev and it just worked. Yay!
Last week I posted about a secret config in Firefox that made view transitions easier to debug.
Folks said we should make it less secret.
So we did.
Folks said we should make it less secret.
So we did.
October 27, 2025 at 10:29 AM
Last week I posted about a secret config in Firefox that made view transitions easier to debug.
Folks said we should make it less secret.
So we did.
Folks said we should make it less secret.
So we did.
JavaScript top-level await is no longer considered 'baseline' due to a pretty big Safari bug caniuse.com/mdn-javascri...
The module graph fails in cases where two modules import a third at the same time. Demo: random-stuff.jakearchibald.com/bug-repros/t...
It's best to avoid the feature for now 😔
The module graph fails in cases where two modules import a third at the same time. Demo: random-stuff.jakearchibald.com/bug-repros/t...
It's best to avoid the feature for now 😔
JavaScript operator: await: Use at module top level | Can I use... Support tables for HTML5, CSS3, etc
caniuse.com
October 26, 2025 at 8:17 PM
JavaScript top-level await is no longer considered 'baseline' due to a pretty big Safari bug caniuse.com/mdn-javascri...
The module graph fails in cases where two modules import a third at the same time. Demo: random-stuff.jakearchibald.com/bug-repros/t...
It's best to avoid the feature for now 😔
The module graph fails in cases where two modules import a third at the same time. Demo: random-stuff.jakearchibald.com/bug-repros/t...
It's best to avoid the feature for now 😔
@mikehall314.bsky.social hmm kinda looks like the slide is introducing the panel
October 26, 2025 at 1:17 PM
@mikehall314.bsky.social hmm kinda looks like the slide is introducing the panel
AV1 is crazy-good for encoding screencasts. 1:28 of video, higher-than-HD resolution, less than 2mb. bugzilla.mozilla.org/show_bug.cgi...
There's not a lot of movement, but many codecs just don't handle that well.
There's not a lot of movement, but many codecs just don't handle that well.
1996198 - Guardian: Hit tests on fixed-bottom element are off by URL bar size
NEW (nobody) in Core - Layout: Positioned. Last updated 2025-10-24.
bugzilla.mozilla.org
October 24, 2025 at 8:53 AM
AV1 is crazy-good for encoding screencasts. 1:28 of video, higher-than-HD resolution, less than 2mb. bugzilla.mozilla.org/show_bug.cgi...
There's not a lot of movement, but many codecs just don't handle that well.
There's not a lot of movement, but many codecs just don't handle that well.
Reposted by Jake Archibald
Don't [...spread] or .split() your strings!
Use Intl.Segmenter API. Available in every JS runtime
Use Intl.Segmenter API. Available in every JS runtime
October 23, 2025 at 2:55 PM
Don't [...spread] or .split() your strings!
Use Intl.Segmenter API. Available in every JS runtime
Use Intl.Segmenter API. Available in every JS runtime
Reposted by Jake Archibald
Match URLs with a powerful, standardized syntax using the URL Pattern API → goo.gle/47iTr3o
Now part of Baseline, this API provides a built-in way to create URL pattern matchers that can be used against URLs or individual URL components.
Now part of Baseline, this API provides a built-in way to create URL pattern matchers that can be used against URLs or individual URL components.
October 23, 2025 at 9:00 PM
Match URLs with a powerful, standardized syntax using the URL Pattern API → goo.gle/47iTr3o
Now part of Baseline, this API provides a built-in way to create URL pattern matchers that can be used against URLs or individual URL components.
Now part of Baseline, this API provides a built-in way to create URL pattern matchers that can be used against URLs or individual URL components.
📝 Importing vs fetching JSON
JSON imports are now supported cross-browser, but when would you use them rather than fetch()?
jakearchibald.com/2025/importi...
JSON imports are now supported cross-browser, but when would you use them rather than fetch()?
jakearchibald.com/2025/importi...
Importing vs fetching JSON
They behave differently, so make sure you pick the right one.
jakearchibald.com
October 22, 2025 at 2:50 PM
📝 Importing vs fetching JSON
JSON imports are now supported cross-browser, but when would you use them rather than fetch()?
jakearchibald.com/2025/importi...
JSON imports are now supported cross-browser, but when would you use them rather than fetch()?
jakearchibald.com/2025/importi...
Aside from "it's the new W3C logo, with the text 'world wide web consortium' in a circle around the outside", what alt text would you use to describe this?
October 21, 2025 at 2:15 PM
Aside from "it's the new W3C logo, with the text 'world wide web consortium' in a circle around the outside", what alt text would you use to describe this?
Reposted by Jake Archibald
New in Firefox nightly (146.0a1 2025-10-19): large lists of unused CSS custom properties are collapsed by default.
This not only reduces clutter, it also massively speeds up the rendering of the inspector panel in some cases.
This not only reduces clutter, it also massively speeds up the rendering of the inspector panel in some cases.
October 21, 2025 at 12:38 PM
New in Firefox nightly (146.0a1 2025-10-19): large lists of unused CSS custom properties are collapsed by default.
This not only reduces clutter, it also massively speeds up the rendering of the inspector panel in some cases.
This not only reduces clutter, it also massively speeds up the rendering of the inspector panel in some cases.
c'mon bsky, support 60fps video!
October 20, 2025 at 2:58 PM
c'mon bsky, support 60fps video!
We're currently working on devtools for view transitions in Firefox, but in the meantime, here's a little-known option that helps…
October 20, 2025 at 2:28 PM
We're currently working on devtools for view transitions in Firefox, but in the meantime, here's a little-known option that helps…
Reposted by Jake Archibald
Love getting linked to a TikTok and you wanna unmute it but you gotta bring your machete to get down there.
October 18, 2025 at 2:57 PM
Love getting linked to a TikTok and you wanna unmute it but you gotta bring your machete to get down there.
Reposted by Jake Archibald
📣 Firefox 144 is out!
What's new for developers:
🧩 View Transition API for SPAs
⚙️ New Map/WeakMap methods (getOrInsert)
🧱 Element.moveBefore()
📱 ScreenOrientation.lock()
🕐 Built-in time picker for (🧪exp.)
Read more 👇
developer.mozilla.org/en-US/docs/...
What's new for developers:
🧩 View Transition API for SPAs
⚙️ New Map/WeakMap methods (getOrInsert)
🧱 Element.moveBefore()
📱 ScreenOrientation.lock()
🕐 Built-in time picker for (🧪exp.)
Read more 👇
developer.mozilla.org/en-US/docs/...
Firefox 144 for developers - Mozilla | MDN
This article provides information about the changes in Firefox 144 that affect developers.
Firefox 144 was released on October 14, 2025.
developer.mozilla.org
October 17, 2025 at 3:00 AM
📣 Firefox 144 is out!
What's new for developers:
🧩 View Transition API for SPAs
⚙️ New Map/WeakMap methods (getOrInsert)
🧱 Element.moveBefore()
📱 ScreenOrientation.lock()
🕐 Built-in time picker for (🧪exp.)
Read more 👇
developer.mozilla.org/en-US/docs/...
What's new for developers:
🧩 View Transition API for SPAs
⚙️ New Map/WeakMap methods (getOrInsert)
🧱 Element.moveBefore()
📱 ScreenOrientation.lock()
🕐 Built-in time picker for (🧪exp.)
Read more 👇
developer.mozilla.org/en-US/docs/...