Friday Issue Nr. 61 | 05/05/2023

Using Maps and WeakMaps, a very handy tool - RegExGPT, Qwik v1.0, UX dark pattern study, scoped CSS and fancy animation examples

JavaScript News

Using Maps and WeakMaps instead of Objects for DOM nodes

I never remember using map() when working with DOM nodes, but this use case makes sense to me.

Practical guide to not blocking the event loop

The interactive guide to rendering in React

This is a very nice and interactive page.

RegExGPT - Regex

I bet you can guess what it does.

Qwik Reaches v1.0


I didn’t know about this Cross-platform native runtime for web apps.

Also, they just announced Capacitor 5.0

Probably for cross-platform native PWA, this is a good-to-know tool.

Pretty TypeScript Errors

This is a plugin for VS Code.

CSS News

Fancy animation examples

Gradient Tracing is fantastic.

Accessible target size

Nice discussion about comfortable icon size on mobile devices. Spoiler alert: between 30x30 is good and 48x48 comfortable, but it depends.

UX dark patterns - case study

Fantastic slides on dark patterns:

The only issue is that I want to order a pizza after digging through the slides! 🙂

Scoped CSS

So, with the scoped CSS

and if we add nested CSS

, and of course, functions:

Then, to me, CSS feels more like a programming language, right?

Ah, and variables, too!

Write CSS by using the JS function pattern.

Quite a long read, but if nothing else, I find the usage of width: max(x, y) quite interesting.

Mixed News

A lock icon will be replaced with a tune icon

30th Anniversary WWW is released into the public domain

This timeline makes me feel so old:

Image Carbon

Oh, this one is a great resource!

You can check how much of your website’s carbon footprint is based on images.