Ollie Williams
@ollie-williams.bsky.social
Mostly posting about web standards.
It’s sad to see Deno being discontinued. However, I think it’s not all terrible. Deno pushed server side JS forward for everyone - Node copied many the standout features Deno had at launch in 2020, bringing them to the masses. Fetch, web sockets, web crypto, direct TypeScript execution, and more. 🫡
JPEG XL shipped in Chrome 155 today, try it out! Huge kudos to Luca and team for getting this done. Image codecs are cool in so many levels, and I'm super impressed by the people who make that magic happen. developer.chrome.com/blog/jpeg-xl...
Shipping JPEG XL in Chrome | Blog | Chrome for Developers
JPEG XL offers better compression than JPEG, built-in HDR support, lossless JPEG transcoding, and more.
developer.chrome.com
The deep issue isn't that CSS-in-JS was always shite, it's that the epistemic rot has settled in so deeply that teams don't know how to evaluate engineering choices on any basis but GH stars and twitter clout. Or as @baldurbjarnason.com quipped, programming as pop culture.
Harry Roberts@csswizardry.com · 6d agoIt’s a real shame that folk a decade ago weren’t warning developers against utterly insane things like CSS-in-J — oh.
Blink: Intent to Experiment: Overscroll Areas
Blink: Intent to Experiment: Overscroll Areas
Blink: Intent to Experiment: Overscroll Areas
groups.google.com
Preact 11 is out 🎉 We’ve been hard at work at making our diffing use modern features like moveBefore , leveraging ESM for tree-shaking Preact Compat and ensuring you have a great experience with resumed hydration.
Fancy tooltips that use popover and anchor positioning are great. But sometimes all you need is a trustworthy title HTML attribute for a text-only tooltip. 😭 Only problem is: it can't be styled! Do you want these tooltips to be stylable? Maybe with a ::tooltip pseudo. Let me know your use cases!
Blink: Intent to Prototype: Focusable interface and sequential focus navigation
Blink: Intent to Prototype: Focusable interface and sequential focus navigation
Blink: Intent to Prototype: Focusable interface and sequential focus navigation
groups.google.com
⚡️ the vlt.io registry now has public packages! we're ready to onboard our open-source friends! ❤️
vlt /vōlt/@vlt.io · 2w agoYour private JavaScript registry can now publish to the public. Public packages are now GA. Publish and install the packages you want to share with the ecosystem. Read the full announcement here ↓ www.vlt.io/blog/public-...
One more call for feedback! Yeah, I know, I often ask for feedback but, think about it, the more you share, the better the feature. 💡Support low-quality image placeholders on the web! ➡️<img previewsrc="preview.avif" src="photo.avif"> ❓Would you use this? What capabilities do you need? Read more⬇️
Patrick - Blurry before beautiful: image previews for the web
Showing blurry previews while images are loading on the web is a very common pattern which we'd love to standardize at the browser level, so that all developers can use it with very little code and co...
patrickbrosset.com
📢 Lot's of updates in our new Edge for devs issue: OpaqueRange, referenceTarget, window-drag, <install>, WebMCP, and more!
New in Edge for developers – Create better components and make your site agent-ready
Welcome back to New in Edge for developers, our recurring roundup of recent web platform updates in Microsoft Edge. In this edition, we'll look more closely at some of the newest additions to Microso...
blogs.windows.com
There's a lot of competition in the Interop 2027 proposals, but I hope we can make `OpaqueRange` a thing next year: github.com/web-platform...
OpaqueRange · Issue #1401 · web-platform-tests/interop
Description Explainer: https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/OpaqueRange/explainer.md The current Range interface methods do not support retrieving or creating ranges that rep...
github.com
Looks like ariaNotify is now supported by all browsers developer.apple.com/documentatio... developer.chrome.com/release-note... www.firefox.com/en-GB/firefo...
Chrome 141 | Release notes | Chrome for Developers
The getAllRecords() method for IndexedDB, WebRTC Encoded Transform V2, and more.
developer.chrome.com
I switch between Safari, Chrome and Firefox multiple times a day but the redesign of Firefox has made it my favourite browser. Like Chrome it has Split View and a vertical tabs option.
I raised multiple proposals for Interop 2027. Please consider voting github.com/web-platform...
Issues · web-platform-tests/interop
web-platform-tests Interop project. Contribute to web-platform-tests/interop development by creating an account on GitHub.
github.com
Preact becomes the first framework to make use of declarative partial updates
Jovi 🐨@jovidecroock.com · last mo.We went further because the bundle-size improvements turned out so well, we added support for use, automatic ref forwarding, ... and now recently we got a PR for adding DPU support which works GREAT! github.com/preactjs/pre... Thank you to everyone, yall are awesome
You can also rerandomize the random values via JavaScript codepen.io/editor/cssgr...
updating random values
A code demo by Ollie Williams created on CodePen
codepen.io
Ollie Williams@ollie-williams.bsky.social · last mo.Safari Technology Preview implemented the random-item() CSS function Demo: codepen.io/editor/cssgr... Release notes: webkit.org/blog/18194/r...
Gap decorations now work for grid-lanes in Chrome Canary: codepen.io/cssgrid/pen/...
grid-lanes + gap decorations
...
codepen.io
Well this is just cool! It even has the invisible cone between an item and its submenu so it doesn't close as you move diagonally. Video made in @polypane.app BTW :)
Patrick Brosset@patrickbrosset.com · last mo.Wow, I had no idea. You can already test Open-UI's proposed native menu elements in Chromium (enable "Experimental Web Platform features" flag in about://flags first). Full native menu bar support with just HTML code! Read the explainer: open-ui.org/components/m... Demo: jsbin.com/qorupiwivu/1...
Some other significant features landed in this release: Navigation API precommit handler, popover=hint, text import attributes, JavaScript .chunks() method, import defer webkit.org/blog/18194/r...
Release Notes for Safari Technology Preview 251
Safari Technology Preview Release 251 is now available for download for macOS Golden Gate and macOS Tahoe.
webkit.org
Ollie Williams@ollie-williams.bsky.social · last mo.Safari Technology Preview implemented the random-item() CSS function Demo: codepen.io/editor/cssgr... Release notes: webkit.org/blog/18194/r...
Safari Technology Preview implemented the random-item() CSS function Demo: codepen.io/editor/cssgr... Release notes: webkit.org/blog/18194/r...
random-item
A code demo by Ollie Williams created on CodePen
codepen.io
“Persistent widgets are embedded browsing contexts, like iframes, but they can persist across same-origin navigations without reloading.”
IntentToShip@intenttoship.dev · 2mo agoBlink: Intent to Prototype: Persistent Widgets
I wish that chromestatus.com/roadmap would use the correct release dates (it uses the "early stable release date", whatever that is). For the actual release dates I have to check chromiumdash.appspot.com/schedule @rachelandrew.co.uk
Chrome Platform Status
chromestatus.com
Web Frameworks Community Group discussed Declarative Partial Updates developer.chrome.com/blog/declara.... We’re getting feedback from framework authors to take to standards bodies. Have opinions? Want to be heard? Join the discord! discord.gg/fXCngmSwHz
Declarative partial updates | Blog | Chrome for Developers
Learn about new out-of-order streaming capabilities and the renewed HTML insertion and streaming methods available for testing from Chrome 148
developer.chrome.com
I'm starting work on a new proposal that extends focusgroup with 2D directional navigation and more author control over nested interactive content. If that sounds useful, please take a look and share your feedback! Very open to thoughts and suggestions!! open-ui.org/components/f...
Proud of this little trick. If you've started using CSS gap decorations, you might know you can inset the lines by some amount. Well, if you also use a CSS size container, you can inset the lines by, say, calc(50cqi - 2px) to get a 4px wide line! ➡️ patrickbrosset.com/lab/containe...
I still can't believe that React isn't shipped as standard JavaScript modules in the year of our lord, Two Thousand Twenty Six.
