Guten Tag! Guten Tag! 👋 

Are you ready for the closedby attribute? Will you measure elements with containertiming? And do you use CSS infinity?

Turn on the Web Weekly tune and find some answers below. Enjoy!

This one was recommended to me by Apple Music while driving back home last week. The moment I heard it for the first time I put it on loop and it was playing for the rest of the journey (1hr). Really positive vibe.

Do you want to share your favorite song with the Web Weekly community? Hit reply; there are five more songs left in the queue.

Let's open this issue by looking at two developer surveys worth your time.

First, the State of Devs survey is open for participation. And if you have a moment, you should fill it out. I sound like a broken record, but things are changing. There's a lot of uncertainty and, frankly, occasionally I'm navigating a full-blown identity crisis. I'm very curious about whether I'm alone with these feelings...

And second, the State of CSS survey results are out! 🎉 As always it's a great read to discover new features and get a feeling for how "cutting edge" everybody is out there.

And to everyone who mentioned me in the resources section, thank you! I'm very humbled to be on this list of great people in the web dev community. 🥹

If you enjoy Web Weekly, share it with your friends and family.

• 🦋 Bluesky
• 🐘 Mastodon
• 💼 LinkedIn

A quick "repost" really helps this indie newsletter out. Thank you! ❤️

Web Weekly Housekeeping 

This week's summer bag of karma points goes to Zerde, who started to support Web Weekly financially. This brings the supporter count to the amazing number of 54.

After subtracting the cost of sending and hosting, Web Weekly now makes around $150 per month. Thank you all for supporting this newsletter! ❤️

So, if you enjoy Web Weekly, give back with a small monthly donation on Patreon or GitHub Sponsors. It really makes a difference for me in these hard times of AI slop and low-effort web creation.

Something that made me smile this week 

Guess what you'll find at clickclickclick.click. I can't help it; I just love people who put out silly things on silly domains. ❤️

Click!

No code 

• Stage Fright. → "There's no way you can go through with this. But you do it anyway. Because it's too late to back out now. Because not doing it would be worse, somehow."
• What does "playing politics" mean for software engineers? → "If you have powerful enemies at a company (for instance, the CTO or an influential VP doesn’t like you), quit."
• How to Take Feedback without Getting Defensive → "Almost always, defensive behaviors are coping mechanisms for difficult emotions."

Browser Performance Timing APIs 

Harry explained the new containertiming attribute, which is currently running as a Chrome Origin trial. If you're not knee-deep into perf topics, the post includes more than one rabbit hole to jump into. For example: Have you used the elementtiming attribute to get render information of image or text nodes? Or, do you use the User Timing API to mark certain render/performance milestones?

Measure!

Promise.all but for good old objects 

The "Await dictionary of Promises" ECMAScript proposal moved to stage three so that we'll finally be able to await objects. Can't wait!

Wait for the properties

On standards, processes, and specifications 

Lea makes a strong case for the usefulness of polyfills. If you want to learn more about the current state of polyfills, ponyfills, and prollyfills (I hadn't heard that one before), this post includes tons of background info.

Fill the platform gaps

CSS Route and Navigation Matching 

Bramus is working on new ways to make view transitions easier to handle in an MPA scenario. This is in its very early stages, but look at this funky CSS.

Bramus is looking for feedback!

Peek into the possible future

The wonderful weird web – Dustin's website 

Well, that's what I call yet another fancy personal website. 👏

Get to know Dustin

CSS infinity 

How could you stack on top of an element with the highest possible z-index (2147483647)? Correct! You use CSS infinity to get on top of the highest stack. Adam lists some more creative infinity use cases.

Stack on top!

Follow the OS font size 

Back in Web Weekly 182, I included the new text-scale meta element which enables sites to react to OS font size changes. I didn't realize that there's more to this topic.

Apparently, there's also the preferred-text-scale CSS env variable. Josh was involved in the spec and shares how a particular BBC problem led to this new font size approach.

Respect the OS

Scale text automatically 

Speaking of text scaling, apparently Chrome 150 shipped the new text-fit property. There are no real MDN docs, and the spec would be the best we've got if it weren't for Krijn, who documented all the options with visual examples.

Scale automatically

Measure SPA navigations 

With Chrome 151, soft navigations entered the mainstream. If you haven't heard the term, a soft navigation is anything that:

• is initiated by a user action.
• results in a visible URL change to the user.
• results in a visible paint.

So, we're talking about a new way to monitor and measure classical SPA navigations.

Measure the navigation

Side note: if you're using the web-vitals library, soft navigations are now supported with v6.

Random MDN – closedby 

From the unlimited MDN knowledge archive...

We're not entirely there yet in terms of browser support, but the new closedby property ships in Chromium, Firefox and is already included in Safari TP, so it's about time to look into it.

Close it with anything

TIL recap – use Intl to format and localize units! 

Here's a quick party trick: did you know that you can use Intl to format numeric values with their units?

Format with style

New on the baseline 

The linear() easing function made it into Baseline widely available territory.

And since Firefox 153, all recent browsers support new info methods like getTimeZones, getTextInfo, or getHourCycles on Intl.Locale objects.

Three valuable projects to have a look at 

• duongductrong/Snapzy – A macOS screenshot and screen recording app.
• charmbracelet/glow – Render markdown on the CLI.
• gkurt/tegaki – Handwriting animation for the web.

Thought of the week 

This is by far my biggest concern with the "new world" we're in. As Koshy says, it's never been so easy to pretend without understanding what's going on.

Did you learn something from this issue? 

❤️ If so, join 54 other Web Weekly supporters and give back with a small monthly donation on Patreon or GitHub Sponsors.

This is all, friends! 

Loved this email? Hated this email? I want to hear about it!

If you think something needs improvement or something sparked some joy, reply to this email because I want to know more!

And with that, take care of yourself - mentally, physically, and emotionally.

I'll see you next week! 👋

Join 6.5k+ developers and