2026-04-27T12:33:42Z https://yabu.me Jake Archibald https://yabu.me/npub1dpjjsyh6ag5p0anhrpzp8d73var3v5l06t4aktylcgslef40ff2q08e0jl https://files.mastodon.social/accounts/avatars/000/007/220/original/a1ee2714b31f25d9.jpg https://files.mastodon.social/accounts/avatars/000/007/220/original/a1ee2714b31f25d9.jpg https://yabu.me/nevent1qqspwjh5zh8xdxa3wr3pny2hhgxaxv3x2tdx08l52nanpuwqchckysgzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99guj5aw0 In reply to <a href='/nevent1qqsw4rxpklhzn7aqrgqewdeu4tadvl35c7wwff3nhxfrvspc95d64cgxj95uz'>nevent1q…95uz</a><br/>_________________________<br/><br/>Yeah! Although… it seems like there&#39;s an oklch technique that picks better values <a href="https://random-stuff.jakearchibald.com/color-contrast/#2277d3">https://random-stuff.jakearchibald.com/color-contrast/#2277d3</a> 2026-05-14T06:32:18Z https://yabu.me/nevent1qqsg0lfnslt5e9j0hwmj3nl5z7d2jtav37cm3275g4jnegc7405jthqzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gdngg3h So, Chrome&#39;s &#34;web standard&#34; Prompt API:<br/><br/>Mozilla: Opposed<br/>WebKit: Opposed<br/>Microsoft: Several concerns<br/>W3C TAG: Several concerns<br/>Developers: Mostly negative<br/><br/>Chrome: Ships anyway.<br/><br/>A sad time for web standards. But, I guess someone at Google will get promoted, so &#39;every cloud…&#39; 2026-05-06T09:50:27Z https://yabu.me/nevent1qqsqdfftm8pett59jmyfgfs3jta4qy8yhvwvs4n9kucgrzr33ft2daszyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99glhnrnn I&#39;ve been playing around with Chrome&#39;s experimental HTML-in-Canvas API (I use it to create my videos), and I wanted to see if I could make text-selection work on a curved surface by moving the underlying element around on pointermove. It works pretty well!<br/><br/>Live demo: <a href="https://random-stuff.jakearchibald.com/apps/curved-markup/">https://random-stuff.jakearchibald.com/apps/curved-markup/</a> (needs Chrome Canary with the canvas-draw-element flag.<br/><br/>Source: <a href="https://github.com/jakearchibald/random-stuff/blob/main/apps/curved-markup/src/App/index.tsx#L113">https://github.com/jakearchibald/random-stuff/blob/main/apps/curved-markup/src/App/index.tsx#L113</a><br/><video controls width="100%" class="max-h-[90vh] bg-neutral-300 dark:bg-zinc-700"><source src="https://files.mastodon.social/media_attachments/files/116/334/307/738/916/951/original/4e606d6fe8bba0bf.mp4"></video><br/> 2026-04-02T09:05:13Z https://yabu.me/nevent1qqsykz829snnvaujn9m57yaj8ajsamvm7cphgcay907fdg2p0cy5e3gzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g8x6xq2 Folks asked if there was a way to disable Chrome&#39;s own &#39;back&#39; transitions, and I didn&#39;t think there was, but… you can use a CloseWatcher to listen for the back gesture (which disables Chrome&#39;s transition), and then call history.back().<br/><br/><a href="https://mastodon.social/@firefoxwebdevs/116295985768415581">https://mastodon.social/@firefoxwebdevs/116295985768415581</a><blockquote class="border-l-05rem border-l-strongpink border-solid"><div class="-ml-4 bg-gradient-to-r from-gray-100 dark:from-zinc-800 to-transparent mr-0 mt-0 mb-4 pl-4 pr-2 py-2">quoting <br/><span itemprop="mentions" itemscope itemtype="https://schema.org/Article"><a itemprop="url" href="/note10kqz9hdq9g3dyre3lr29y85kfz2ks0ldzfzj422d6w6dadhddmcs2xrq8l" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1">note10kq…rq8l</a></span><br/> </div> hasUAVisualTransition landed in Firefox 149, making it available across all major engines. As well as having a very catchy name, it lets you avoid doubling up on page transitions. Here's how it works:<br/><video controls width="100%" class="max-h-[90vh] bg-neutral-300 dark:bg-zinc-700"><source src="https://files.mastodon.social/media_attachments/files/116/295/980/096/103/884/original/411a24edc30e5286.mp4"></video><br/> </blockquote> 2026-03-31T09:37:55Z https://yabu.me/nevent1qqs88dtxn63mt0tkqx2t32r3thvsk3lrxszxmjrwgurws3ecpzxuqsczyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g8shvpd In reply to <a href='/nevent1qqsz8fqep86ql95wnh89rpe33zuu0cx4pv2y400thaqssmt35gmewcc9zsycl'>nevent1q…sycl</a><br/>_________________________<br/><br/>thank you for saying that. It&#39;s… been a rough day. 2026-01-07T17:50:35Z https://yabu.me/nevent1qqsvszyv25ucn07pnqqlydc6nwnwe3rr9lr7mmzetkutkpvns3ce0fgzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g89564s In reply to <a href='/nevent1qqsgsm3hphdl7apvh2fdfwm2d5hmj6eenvg32x0eh7q5s8xazpr6sespw6rf5'>nevent1q…6rf5</a><br/>_________________________<br/><br/>the wonderful <span itemprop="mentions" itemscope itemtype="https://schema.org/Person"><a itemprop="url" href="/npub1y3j422rqevqyhz2jx5729p8l3x8ja3qhcq7w5hfhc730efs606xsq5ymdz" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1"><span>Adam Argyle</span> (<span class="italic">npub1y3j…ymdz</span>)</a></span> 2025-12-20T12:19:04Z https://yabu.me/nevent1qqs9ft2kqgrud5mm5hy4409crlsx2ck2tfs80s77my6t9mfegfrrzxqzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gqak5dz It&#39;s really sad that Chrome laid off one of the world&#39;s best CSS developer-designers, and now they have to fake demos of web features. <a href="https://youtu.be/d8J0vs-bEPE?si=l7YPHL8Tws-0iiBL">https://youtu.be/d8J0vs-bEPE?si=l7YPHL8Tws-0iiBL</a> 2025-12-20T10:40:28Z https://yabu.me/nevent1qqsrec6fgp8529a7u2vpxx960rttksexj8h8y5mwcm2lasd65rphnpczyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gu0g2hl RE: <a href="https://mastodon.social/@FirefoxDevTools/115573428208353380">https://mastodon.social/@FirefoxDevTools/115573428208353380</a><br/><br/>I&#39;m experimenting with this format. Is it… good? Like, should I do more of this kind of thing? Critical feedback welcome!<blockquote class="border-l-05rem border-l-strongpink border-solid"><div class="-ml-4 bg-gradient-to-r from-gray-100 dark:from-zinc-800 to-transparent mr-0 mt-0 mb-4 pl-4 pr-2 py-2">quoting <br/><span itemprop="mentions" itemscope itemtype="https://schema.org/Article"><a itemprop="url" href="/note14456pykv8senp9v7ts2cx3h6gh8nxj32g9tdrunvu4ckd6c8ltfswkceck" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1">note1445…ceck</a></span><br/> </div> 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:<br/><video controls width="100%" class="max-h-[90vh] bg-neutral-300 dark:bg-zinc-700"><source src="https://files.mastodon.social/media_attachments/files/115/573/426/696/414/292/original/0dc4374e1f7ea3a4.mp4"></video><br/> </blockquote> 2025-11-19T00:03:48Z https://yabu.me/nevent1qqsy7dk9eg827uydyqq30vnzll3uqq24tamufd87fes48xc7dpyqm7szyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gcttp0e In reply to <a href='/nevent1qqstupvvvc95q50jn6z0d9v7kl2tzwhk7adfy24xng8mpkqf6qp9dncwt87xw'>nevent1q…87xw</a><br/>_________________________<br/><br/>it&#39;s not something I&#39;ve needed either, but I know the Svelte and Astro folks have been bitten by this bug. 2025-10-26T21:02:35Z https://yabu.me/nevent1qqs0zq88zfdrrtf5h29agxn4qn0yu5ptkz7w9gckm5mxm3c99x9eezszyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gu3566g JavaScript top-level await is no longer considered &#39;baseline&#39; due to a pretty big Safari bug <a href="https://caniuse.com/mdn-javascript_operators_await_top_level">https://caniuse.com/mdn-javascript_operators_await_top_level</a><br/><br/>The module graph fails in cases where two modules import a third at the same time. Demo: <a href="https://random-stuff.jakearchibald.com/bug-repros/top-level-await-webkit/?timeout=1000">https://random-stuff.jakearchibald.com/bug-repros/top-level-await-webkit/?timeout=1000</a><br/><br/>It&#39;s best to avoid the feature for now 😔 2025-10-26T20:17:55Z https://yabu.me/nevent1qqstexg8sxhc4jwetrclm74lndhzz6hl4ey2v9f5trdvr4pe36pre7szyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gxjvd9e 📝 Importing vs fetching JSON<br/><br/>JSON imports are now supported cross-browser, but when would you use them rather than fetch()?<br/><br/><a href="https://jakearchibald.com/2025/importing-vs-fetching-json/">https://jakearchibald.com/2025/importing-vs-fetching-json/</a> 2025-10-22T14:50:57Z https://yabu.me/nevent1qqsr3ln5thazvuve3k2fmpwrryrpfy0n50du2q6mj9meuhe0w8nqnjszyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gxxee7c I dug into progressive image rendering and found a bunch of common assumptions aren&#39;t quite true.<br/><br/>➡️ JPEG &amp; WebP progressive-renders worse in Safari<br/>➡️ AVIF _does_ support progressive<br/>➡️ But JPEG XL in Safari doesn&#39;t<br/>➡️ JPEG XL decodes much slower than AVIF<br/>⬇️ …and more<br/><br/><a href="https://jakearchibald.com/2025/present-and-future-of-progressive-image-rendering/">https://jakearchibald.com/2025/present-and-future-of-progressive-image-rendering/</a> 2025-10-16T10:16:32Z https://yabu.me/nevent1qqsppggdmarlvzeaxyzgje2ph9s7wmvkgez6m908vvvtuwd7h6qjktszyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99ga39uek A bunch of Firefox leadership will be doing a Reddit AMA, October 6th, at 10:30 PT. If you have questions you want to ask them directly, pop the date in your calendar <a href="https://www.reddit.com/r/firefox/comments/1ntui9x/upcoming_ama_with_firefox_leadership/">https://www.reddit.com/r/firefox/comments/1ntui9x/upcoming_ama_with_firefox_leadership/</a> 2025-09-30T10:39:26Z https://yabu.me/nevent1qqsxv9jzf2x5mv70jfhjprfp45v6nyd8cmcq4n2hjr5kasn7e29pg3gzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gpfedes SVGOMG has been updated to use SVGO 4! (thanks Adrien Crivelli!)<br/><br/>This is the URL for SVGOMG. Unfortunately someone maintains a fork with ads, so, err, don&#39;t use that 😀<br/><br/><a href="https://jakearchibald.github.io/svgomg/">https://jakearchibald.github.io/svgomg/</a> 2025-09-29T08:38:08Z https://yabu.me/nevent1qqspt2mgal736emjhgp8v0aw64yyx3lvu8kcpu6zc7evp3qg39cmqqszyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gq5vg2g Hey folks! Are you interested in fetch upload streams? If so, what do you want to use them for?<br/> <img src="https://files.mastodon.social/media_attachments/files/115/140/724/120/031/925/original/f4bb572137beda63.png"> <br/> 2025-09-03T14:00:32Z https://yabu.me/nevent1qqspxh9g7dez52282qzn2zvetmlr5ck4zad4xxqxltjrn5q6v60tt7szyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gk2x2fc 📝 Making XML human-readable without XSLT.<br/><br/>Turns out, JavaScript works pretty well!<br/><br/><a href="https://jakearchibald.com/2025/making-xml-human-readable-without-xslt/">https://jakearchibald.com/2025/making-xml-human-readable-without-xslt/</a> 2025-09-02T17:23:34Z https://yabu.me/nevent1qqsfu5mzdp2w02r0eu52uezxgsyw3sl5vcshw9xx2j0dm37rq3rka7qzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gh9s8hs Yay! It&#39;s the first Firefox release since I&#39;ve joined the team, so let&#39;s take a look at some of the new developer-facing features in Firefox 142… 🧵 2025-08-22T09:55:37Z https://yabu.me/nevent1qqst48cfuuklq8ljsfa0jp9aytgfvg2ckq0v96cw8mnacf67kktezuczyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g4yw9lr View Transitions are enabled by default in Firefox Nightly, so they&#39;re on their way to stable. Give it a test with your current transitions, and give me a shout if anything doesn&#39;t look right.<br/><br/>I&#39;m happy to report the most important transition works perfectly <a href="https://simple-vt-demos.jakearchibald.com/batman-transition/">https://simple-vt-demos.jakearchibald.com/batman-transition/</a> 2025-08-21T08:17:18Z https://yabu.me/nevent1qqspuqdug7nzsfajrdh7vsc9uejzh4hj9kpqnwusvey2xlg8pducvwszyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g3vrm5k Starting my new role on Monday. Could be anywhere.<br/> <img src="https://files.mastodon.social/media_attachments/files/114/947/962/351/080/799/original/21dccc81aedd7c62.jpg"> <br/> 2025-07-31T12:58:46Z https://yabu.me/nevent1qqsp5xgv3duxphls04stemnuntcahudnygu6uve76zfzyrvq6h3mhwqzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gj5jhmy In reply to <a href='/nevent1qqszmf0zypdrp0dldqv027zm6v94ep6uf04tst05kzg9d0hhmn0rsusc54ust'>nevent1q…4ust</a><br/>_________________________<br/><br/>it literally makes my day when people enjoy my bullshit 2025-07-01T19:13:51Z https://yabu.me/nevent1qqszs0r53czs2g380kjpdvlhf5wuwc0q6f9zzh0m7twc0tpuhc459dqzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g08sffd In reply to <a href='/nevent1qqswycll0jlqq0m997x2hlt2545t3z6wfpf8aj38wwvrkncvdel3n4qhmavgz'>nevent1q…avgz</a><br/>_________________________<br/><br/>oh mate it was a long and arduous post, by design. I had more fun writing it than anyone had reading it. 2025-07-01T18:44:35Z https://yabu.me/nevent1qqsy9m0k803ceacp4pmak6w8xze4p7zygtwsy96lkrw7nn8vdp67y3gzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gyzpwdy In reply to <a href='/nevent1qqswelk3pafclu7yqt2kmp9zlrc3psraucd5xdgz5hscdt66kjynp7slcgy7q'>nevent1q…gy7q</a><br/>_________________________<br/><br/>as far as I can tell, the difference between section &amp; aside is the role, which you&#39;re overwriting anyway. 2025-07-01T16:43:00Z https://yabu.me/nevent1qqsdec78dg6rtt8hf0q0u6nshmhmea3mvuzyscyg565s8x2dpdd7u7czyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gn76ufx I hate footnotes, especially on the web, and hopefully by the end of this, you will too.<br/><br/><a href="https://jakearchibald.com/2025/give-footnotes-the-boot/">https://jakearchibald.com/2025/give-footnotes-the-boot/</a> 2025-07-01T15:23:01Z https://yabu.me/nevent1qqsp9ya2dsrat8rvpwtglm3jma6fwajutseyyetc5c4mrtv5ygzj59szyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gpuwgqh I think Meta&#39;s going to win the AI race lads!<br/> <img src="https://files.mastodon.social/media_attachments/files/114/245/239/571/085/602/original/6dac5372f6ac8feb.png"> <br/> 2025-03-29T10:27:43Z https://yabu.me/nevent1qqsd2lhf4qh5c30gmpvcmt3tdwzqfph9ucxnkz4scwah06kggux2qpczyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gtkc82s 🔊 ICYMI: <span itemprop="mentions" itemscope itemtype="https://schema.org/Person"><a itemprop="url" href="/npub122879jyh5uvucxn9wcrr2pfdyp4lw6yakawu7m4jfs4cc3w5w5jq6swtdf" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1"><span>Surma</span> (<span class="italic">npub1228…wtdf</span>)</a></span> talked through Nix in the last OTMT, comparing it to other build systems we&#39;d looked at in previous episodes <a href="https://offthemainthread.tech/episode/nix/">https://offthemainthread.tech/episode/nix/</a> 2024-11-18T13:48:11Z https://yabu.me/nevent1qqsr4g49da0vvgrkd2zq8kxd0ud8f2ujfjetc6q6rdu5ktjduylay6szyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gnj292f Wow Google Docs, this is some of the worst copywriting I&#39;ve seen in a long time.<br/> <img src="https://files.mastodon.social/media_attachments/files/113/436/085/776/251/843/original/0fd59fd18814adb0.png"> <br/> 2024-11-06T12:57:51Z https://yabu.me/nevent1qqsdhzy7ukjxzv9xfflfgd4t329h52dxjlaw6frt0qvnrwxp05adjhczyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g2ru5k0 I&#39;m excited that we&#39;re finally getting a customisable &lt;select&gt; on the web. However, there&#39;s one detail of it I&#39;m really not sure about, and I&#39;d like to hear your thoughts.<br/><br/>Have your say before it&#39;s too late 😀<br/><br/><a href="https://jakearchibald.com/2024/how-should-selectedoption-work/">https://jakearchibald.com/2024/how-should-selectedoption-work/</a> 2024-10-18T11:46:37Z https://yabu.me/nevent1qqstgaptudchta0yj23fvy9dmapg7qr8lxh3epqfnlngsv44ze4d2fgzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99gwqaj6s `el.className` and `el.htmlFor` have such unusual names because `class` and `for` used to be reserved words in JS. That hasn&#39;t been true for property names for 10+ years.<br/><br/>Firefox is experimenting with adding `el.class` and `el.for`, yay!<br/><br/><a href="https://github.com/whatwg/html/issues/9379#issuecomment-2357214793">https://github.com/whatwg/html/issues/9379#issuecomment-2357214793</a> 2024-09-18T08:27:22Z https://yabu.me/nevent1qqstf2krdzztqtrdgahgscszwjlf8fw6xux75nz258zymeycd0f6wygzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g857q4r 📝 I set off to find the best way to make video with transparency work on the web.<br/><br/>Over 10 bug reports later, it turns out it&#39;s better to handle the transparency manually with WebGL. Here&#39;s how:<br/><br/><a href="https://jakearchibald.com/2024/video-with-transparency/">https://jakearchibald.com/2024/video-with-transparency/</a> 2024-08-05T11:29:11Z https://yabu.me/nevent1qqs8zlywk4xyx04cux39prue08ts0k8ctm5wjl3uvk6zm9ugp9j34ygzyp5x22qjlt4zs9lkwuvygyah69n5w9jnalfwhkevnlpzrl9x4a99g7nrh2q 🔊 Are Web Components Worth It?<br/><br/>In the latest OTMT, me and <span itemprop="mentions" itemscope itemtype="https://schema.org/Person"><a itemprop="url" href="/npub122879jyh5uvucxn9wcrr2pfdyp4lw6yakawu7m4jfs4cc3w5w5jq6swtdf" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1"><span>Surma</span> (<span class="italic">npub1228…wtdf</span>)</a></span> look at the benefits and tradeoffs of web components, and how things could improve.<br/><br/>⬇️ Listen here ⬇️<br/><a href="https://offthemainthread.tech/episode/are-web-components-worth-it/">https://offthemainthread.tech/episode/are-web-components-worth-it/</a> 2024-07-02T14:06:27Z