Lightnews — Scholar-powered news

LightNews

Stefan Judis

@stefanjudis.com

1.9K followers 300 following 440 posts

Freelance dev sending Frontend news to 6k people over at webweekly.email. Sharing lots of tips'n'tricks on the way. Google Dev Expert, Microsoft MVP and Playwright Ambassador

Posts Media Videos Starter Packs

Pinned

Stefan Judis @stefanjudis.com · 15h

The new Web Weekly is just about to hit all the inboxes. 🥂

It's jam-packed with modern CSS magic, performance fundamentals and JavaScript tips and tricks.

You should check it out if you're into the web platform!

www.stefanjudis.com/blog/web-wee...

Web Weekly 170

- AbortController
- Object.groupBy
- @function and if()
- cqb and cqi units
- ::details-content
- the <output> element

Stefan Judis @stefanjudis.com · 7h

I stumbled over this `css-extra` repo and now tell me that CSS isn't a programming language. 🫣😅

github.com/sindresorhus...

Note: CSS functions are a Chromium-only thing by now, but, still, CSS is becoming even more wild soon!

.element {
/* Math functions */
padding: --negate(var(--spacing));
margin: --abs(-20px);

/* Color functions */
background: --opacity(blue, 50%);
border-color: --tint(var(--primary-color), 20%);

/* Typography */
font-size: --fluid-type(16px, 24px);

/* Layout */
border-radius: --conditional-radius(1rem);

/* And many more! */
}

Stefan Judis @stefanjudis.com · 7h

Thanks Brian. :) Yeah, that's what I thought and I can't imagine how much work goes into all the spec work.

Reposted by Stefan Judis

Stefan Judis @stefanjudis.com · 15h

The new Web Weekly is just about to hit all the inboxes. 🥂

It's jam-packed with modern CSS magic, performance fundamentals and JavaScript tips and tricks.

You should check it out if you're into the web platform!

www.stefanjudis.com/blog/web-wee...

Web Weekly 170

- AbortController
- Object.groupBy
- @function and if()
- cqb and cqi units
- ::details-content
- the <output> element

Reposted by Stefan Judis

Piccalilli @piccalil.li · 10h

86,791 words later, countless rounds of thorough technical edits and a humongous team effort building custom infrastructure, JavaScript for Everyone is now ready and available to purchase.

piccalil.li/links/javasc...

JavaScript for Everyone is now available

86,791 words later, countless rounds of thorough technical edits and a humongous team effort building custom infrastructure, JavaScript for Everyone is now ready and available to purchase.

Stefan Judis @stefanjudis.com · 15h

The new Web Weekly is just about to hit all the inboxes. 🥂

It's jam-packed with modern CSS magic, performance fundamentals and JavaScript tips and tricks.

You should check it out if you're into the web platform!

www.stefanjudis.com/blog/web-wee...

Web Weekly 170

- AbortController
- Object.groupBy
- @function and if()
- cqb and cqi units
- ::details-content
- the <output> element

Reposted by Stefan Judis

rem / Remy Sharp @remysharp.com · 4d

Pleased to share the final full line up for 2025.ffconf.org

It's a day that you'll come away from inspired and full of ideas.

The speakers for FFConf in a grid with topics: distributed power, inclusivity by design, design systems and web components, privacy and ethics, the good internet, ai brain drain, code and culture and finally: journey to coder.

Stefan Judis @stefanjudis.com · 1d

You know the drill... 🫣 I'm about to sit down to write this week's Web Weekly!

If web dev fundamentals are your thing (you know; HTML, CSS and JS), you should check it out!

This week's email will hit over 6k inboxes this evening.

webweekly.email

Web Weekly — Your friendly web dev newsletter.

Stefan Judis @stefanjudis.com · 7d

Agreed. Strange but legit. 😅

Stefan Judis @stefanjudis.com · 7d

Yeah... I had the same initial reaction. 😅

Must be some perf thing, yes. 🤷‍♂️ I'm fine with using `fromAsync`.

Stefan Judis @stefanjudis.com · 7d

Same!

Stefan Judis @stefanjudis.com · 7d

TIL, Node.js ships a native `glob` utility since 22.17. 🎉

import { glob } from 'node:fs/promises';

const files = await glob('**/*.txt');
console.log(await Array.fromAsync(files));

Stefan Judis @stefanjudis.com · 7d

So, there's the new `corner-shape` CSS property (Chromium-only right now) and I was quite surprised about all the possible use cases going beyond the famous squircle examples.

css-tricks.com/what-can-we-...

What Can We Actually Do With corner-shape? | CSS-Tricks

When I first started messing around with code, rounded corners required five background images or an image sprite likely created in Photoshop, so when

Stefan Judis @stefanjudis.com · 8d

Very much appreciated! ❤️ Thank you for reading along!

Stefan Judis @stefanjudis.com · 8d

I must admit that I've forgotten the double focus ring practice to guarantee accessible focus rings on all sorts of backgrounds, but it's such a smart way to solve the issue of hard-to-spot focus styles.

@ericwbailey.website did a fabulous job explaining the technique!

piccalil.li/blog/taking-...

A paragraph with a focused link that comes with double-bordered (black and white) focus styles.

Reposted by Stefan Judis

Stefan Judis @stefanjudis.com · 9d

Aaaaaand it's going out. 🫣

As always, you can read Web Weekly online, too. 👇

www.stefanjudis.com/blog/web-wee...

Stefan Judis @stefanjudis.com · 9d

Aaaaaand it's going out. 🫣

As always, you can read Web Weekly online, too. 👇

www.stefanjudis.com/blog/web-wee...

Stefan Judis @stefanjudis.com · 9d

I skipped a week because I was a bit under the weather but the new Web Weekly will hit all the inboxes in just a little bit.

Join the fun if you want to stay up to date with the current state of the web (you know HTML, CSS and JS). 👇

webweekly.email

Web Weekly — Your friendly web dev newsletter

Stefan Judis @stefanjudis.com · 17d

This year's State of JS survey is open and it comes with easy to access code snippets and baseline info so that you'll def learn some new tricks when filling it out. 👏

survey.devographics.com/en-US/survey...

Answers in the questionnaire showing code snippets and baseline information.

Reposted by Stefan Judis

Manuel Matuzović @matuzo.at · 21d

So far I've received 11 submissions for this year's #HTMHellAdventCalendar. They look fantastic, but, you know, I need at least 24.

You can write about anything you want related to HTML. There's no “too basic”; we need more fundamental HTML knowledge out there because we suck at the basics. 1/2

HTMHell Advent Calendar

Hello, my dear friends of high-quality markup! We're getting closer to the last quarter of 2025, which means that the HTMHell Advent Calendar is getting closer, too. Last year, once again, you contrib...

docs.google.com

Stefan Judis @stefanjudis.com · 22d

View transitions enable a fairly straightforward way to animate/transition elements. Imo, they'll change how the web will feel.

developer.chrome.com/docs/web-pla...

Smooth transitions with the View Transition API | View Transitions | Chrome for Developers

The View Transition API lets you add transitions between views of a website.

developer.chrome.com

Stefan Judis @stefanjudis.com · 22d

You know the drill. 🫣

I'm just about to get ready to sit down to write this week's Web Weekly newsletter. If you're into webdev news close to the platform (you know vanilla HTML, CSS and JS), join 6k subscribers. 👇

webweekly.email

Web Weekly — Your friendly web dev newsletter.

Stefan Judis @stefanjudis.com · 22d

My small side project tiny-helpers.dev just passed 1k GitHub stars. 🎉

If you don't know it yet, the site lists 678 small utility tools for web developers that you usually won't find when googling. And over 200 people contributed already. 😊

GitHub repo stefanjudis/tiny-helpers showing 1k GitHub stars.

Stefan Judis @stefanjudis.com · 22d

Oct 14 Firefox 144 will ship JS-powered view transitions with `startViewTransition`. 🎉

Of course, this is only the first step because we're all waiting for cross-document view transitions, too, but I'm still very happy about view transitions being on their way to work everywhere.

Compat table showing that Firefox 144 will support `startViewTransition`.

Reposted by Stefan Judis

Adam Argyle @nerdy.dev · 23d

❌ mobile first
✅ container first

Stefan Judis @stefanjudis.com · 25d

`hidden=until-found` landed in Safari Tech Preview so that we're on our way to baseline support. 🎉

It allows showing hidden content when it's matched from in-page search. A common example are `details` elements that open when they include the searched text.

developer.mozilla.org/en-US/docs/W...

Added support for auto-expanding details and hidden=”until-found” elements for text searches done via assistive technologies. (299649@main) (159913471)