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...
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/...
Reposted by Jake Archibald
With View Transitions now being Baseline Newly available, and the View Transition API consisting of various features, it can be confusing to know what is supported in which browser versions.
To help with that, I created this VT Feature Explorer (powered by View Transitions)
web.dev/blog/same-do...
To help with that, I created this VT Feature Explorer (powered by View Transitions)
web.dev/blog/same-do...
October 16, 2025 at 6:38 PM
With View Transitions now being Baseline Newly available, and the View Transition API consisting of various features, it can be confusing to know what is supported in which browser versions.
To help with that, I created this VT Feature Explorer (powered by View Transitions)
web.dev/blog/same-do...
To help with that, I created this VT Feature Explorer (powered by View Transitions)
web.dev/blog/same-do...
I dug into progressive image rendering and found a bunch of common assumptions aren't quite true.
➡️ JPEG & WebP progressive-renders worse in Safari
➡️ AVIF _does_ support progressive
➡️ But JPEG XL in Safari doesn't
➡️ JPEG XL decodes much slower than AVIF
⬇️ and more
jakearchibald.com/2025/present...
➡️ JPEG & WebP progressive-renders worse in Safari
➡️ AVIF _does_ support progressive
➡️ But JPEG XL in Safari doesn't
➡️ JPEG XL decodes much slower than AVIF
⬇️ and more
jakearchibald.com/2025/present...
The present and potential future of progressive image rendering
Exploring progressive image rendering across JPEG, PNG, WebP, AVIF, and JPEG XL.
jakearchibald.com
October 16, 2025 at 10:16 AM
I dug into progressive image rendering and found a bunch of common assumptions aren't quite true.
➡️ JPEG & WebP progressive-renders worse in Safari
➡️ AVIF _does_ support progressive
➡️ But JPEG XL in Safari doesn't
➡️ JPEG XL decodes much slower than AVIF
⬇️ and more
jakearchibald.com/2025/present...
➡️ JPEG & WebP progressive-renders worse in Safari
➡️ AVIF _does_ support progressive
➡️ But JPEG XL in Safari doesn't
➡️ JPEG XL decodes much slower than AVIF
⬇️ and more
jakearchibald.com/2025/present...
We've already had a great response to this. Thank you everyone who took the time to make a ranking - I know there's a lot of proposals.
If you haven't, there's still time!
bsky.app/profile/fire...
If you haven't, there's still time!
bsky.app/profile/fire...
As an experiment, we (the Firefox team) wanted to try a new way to get feedback on which Interop proposals matter most.
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
Interop Feature Ranking
Rank the web platform features you care most about
interop-rank.jakearchibald.com
October 15, 2025 at 7:45 PM
We've already had a great response to this. Thank you everyone who took the time to make a ranking - I know there's a lot of proposals.
If you haven't, there's still time!
bsky.app/profile/fire...
If you haven't, there's still time!
bsky.app/profile/fire...
I am once again bewildered by the motives of people who knock on the door of an occupied public toilet.
October 12, 2025 at 2:55 PM
I am once again bewildered by the motives of people who knock on the door of an occupied public toilet.
Hello other parts of the world! If you'd like to tell us your preferences from a list of web features people are already describing as "a bit long", here's how: bsky.app/profile/fire...
As an experiment, we (the Firefox team) wanted to try a new way to get feedback on which Interop proposals matter most.
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
Interop Feature Ranking
Rank the web platform features you care most about
interop-rank.jakearchibald.com
October 10, 2025 at 9:47 AM
Hello other parts of the world! If you'd like to tell us your preferences from a list of web features people are already describing as "a bit long", here's how: bsky.app/profile/fire...
This was… quite quickly thrown together, so hopefully everything works well! I'm really hoping it gives developers more of a voice in the process.
Feel free to shout at me if anything doesn't look right.
bsky.app/profile/fire...
Feel free to shout at me if anything doesn't look right.
bsky.app/profile/fire...
As an experiment, we (the Firefox team) wanted to try a new way to get feedback on which Interop proposals matter most.
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
Interop Feature Ranking
Rank the web platform features you care most about
interop-rank.jakearchibald.com
October 9, 2025 at 5:06 PM
This was… quite quickly thrown together, so hopefully everything works well! I'm really hoping it gives developers more of a voice in the process.
Feel free to shout at me if anything doesn't look right.
bsky.app/profile/fire...
Feel free to shout at me if anything doesn't look right.
bsky.app/profile/fire...
Reposted by Jake Archibald
There are… a lot of proposals, but you don't need to rank them all. Skim through the list, and find the few you really care about.
This is an experiment, so we're also interested in feedback on the app itself, and things we can improve for next year.
This is an experiment, so we're also interested in feedback on the app itself, and things we can improve for next year.
October 9, 2025 at 5:00 PM
There are… a lot of proposals, but you don't need to rank them all. Skim through the list, and find the few you really care about.
This is an experiment, so we're also interested in feedback on the app itself, and things we can improve for next year.
This is an experiment, so we're also interested in feedback on the app itself, and things we can improve for next year.
Reposted by Jake Archibald
As an experiment, we (the Firefox team) wanted to try a new way to get feedback on which Interop proposals matter most.
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
Interop Feature Ranking
Rank the web platform features you care most about
interop-rank.jakearchibald.com
October 9, 2025 at 5:00 PM
As an experiment, we (the Firefox team) wanted to try a new way to get feedback on which Interop proposals matter most.
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
So, here's a web app where you can rank the proposals you care about, giving us data we can use when reviewing which ones to champion.
interop-rank.jakearchibald.com
Folks who want to see JPEG-XL supported in more browsers, what is it about the format that attracts you to its use on the web?
October 7, 2025 at 2:16 PM
Folks who want to see JPEG-XL supported in more browsers, what is it about the format that attracts you to its use on the web?