Today’s Readings

highlights that Webkit TP 178 includes:

  • Enabled Fetch Priority by default
  • Enabled requestIdleCallback
  • Enabled responsive images in <link rel="preload">

All absolute slammers, bravo!

We in tech live in a world of acronyms and special terms. From HTML, CSS and JS, to API to NPM, if you want to become an SME ASAP, checkout this SPA:

And if you want to get to know CSS selectors better, offers a visual guide to how CSS selectors work and can chain together.

And if you want to get to know JS async/await better, shares both a video and written version of Internals of async / await in JavaScript. A great explainer starting from “what are we trying to achieve” and going right through several examples.

curl is a tool most of us use quite often, and probably most often by either copying from a previous project or just Googling how to do something. Well, if you ever want to get to know the library well, shares Mastering curl: interactive text guide, which covers everything from the humble beginnings, to all the options, and all the basics, including interactive demos!

alt text is something I try to include for every graphic I include on the web. But alt text for code samples is something I never really thought about before… Well, explains how he approached alt text for code snippets. Thanks, Ben!

Next up, shares how to create scroll-based 3D cards. Note that, although Kushagra does not mention it, at the time of this writing, I think Chrome is required (it doesn’t work in my Firefox, anyhow).

I am really looking forward to View Transitions coming to prime time on the web, but cautions about possible perceived-performance woes (and possible work-arounds?).

Another performance concern, and possible solution, talks about the LCP issues found in Drupal’s “demo” profile, which I imagine a lot of people use to get started with new sites / fresh installs. Basically, the hero section uses a background-image, which is a notoriously slow method for rendering images. Mike walks through several ways to fix that.

Any GitHub users out there? Yeah, thought so. Well check out this list of undocumented features that let you open repos in online VSCode, add experimental features, regex code search, and more!

shares a high-level accessibility check that compares the video element implementation in all modern browsers. I love his video element code sample! Including a track, fallback download link, and even a fallback download link for the transcript!

<video preload="metadata" controls="" poster="JAWS-aria-errors_poster.jpg">
  <source src="JAWS-aria-errors.mp4" type="video/mp4">
  <track label="English" kind="subtitles" srclang="en-us" src="JAWS-aria-errors.vtt" default="">
  Sorry, your browser doesn’t support embedded videos, but don’t worry, you can <a href="JAWS-aria-errors.mp4">download it</a>. The <a href="JAWS-aria-errors.vtt">caption file</a> is also available in case your video player can import it.

Above, Adrian’s video code sample also includes a poster attribute. And to create that poster image, you can use, which is a free, open-source, browser-or-API tool for creating thumbnails from any public URL video, from any time within that video. Pretty sweet…

Speaking of video (sort of), what-in-the-what am I looking at here???

And finally, ever wonder what the sun sounds like? What about a black hole?? Or two black holes merging??? And no, I am not going to ask what Uranus sounds like… But The Sounds of Space will! :-)

And finally, finally, ever wanted to talk to whales? Well, maybe someday soon we will at least be able to understand them, and that would be a pretty great first step…

Happy reading,

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.