Artboard 16light, inspiration, solution, idea, innovation,ionicons-v5_logosGoogle Sheets iconSwift icon
Published at
Updated at
Reading time
6min
The Web Weekly newsletter keeps you up to date, teaches you web development tricks and covers all things working in tech.

Happy week, friends! πŸ‘‹

I just discovered that the great resignation has its own Wikipedia entry now and because I quit my job, too, I reflected on the reasons to change companies six times in eleven years.

To my surprise, I mainly changed jobs because of "bigger" topics like an overall disagreement with the company vision or not being satisfied with company values that were nothing but wallpaper.

And even though no reason was the same, five of my six resignations had one thing in common. My managers were caught by surprise and only started acting on my frustration after I decided to leave.

This is months too late...

I learned about an approach that could help out while listening to the Work Life podcast – the stay interview.

Ask people why they’ve decided to stick around – and what would keep them in the future. That’s called a stay interview.

A stay interview focuses on the present. It focuses on the things that keep you going, the things you want to have more of. We all should have more stay interviews!

And with this, today you'll learn about:

  • the new fetchpriority attribute
  • the beauty of web components
  • fancy CLI tools

... and, as always, GitHub repositories, a new Tiny Helper and some music.

Lastly, welcome to the 44 new subscribers! I'm super excited to have you around! πŸ‘‹

Something that made me smile this week

Floor with obstacles for a cat to jump over.

I'm no cat person, but the challenges of "🐾 Mia the Cat 🐾" made me smile this week. Make sure to turn your sound on.

Very cool, but to use sparingly – fetchpriority

Source code including `fetchpriority` in a `link` element and `priority` in a JS `fetch` call.

There's a new priority hint in town if you want to give browsers additional information on resource loading order!

Adrian explains fetchpriority in great detail. But be careful; if you start prioritizing everything, nothing is.

Fetch it like it's hot

Seven web component tricks

In your CSS inside the Web Component, you have something like this:  :host-context(.card) { background:pink; } :host-context(.card)::after { content: 'I’m in a card' }

I wrote my first article on web components using Polymer nine years ago. And even though custom elements are perfect for building and distributing small UI components, they're still not taking off, aren't they?

It's such a bummer. Let me still share some good ones:

If you want to start building things with web components, Dave shares little-known tricks. πŸ‘‡

Discover some web component tricks

A missing Twitter feature: MegaBlock

Don't like a bad tweet? Block the tweet, its author, and every single person who liked itβ€”in one click.

Disclaimer: I'm not talking about Twitter's missing edit button.

But when I discover tiny tools enriching and adding features to platforms like Twitter, I get excited. megablock.xyz allows you to block a whole bunch of people.

Block, block, block!

The dialog element in action

A modal dialog to create a new user

Adam explains how to use the dialog element with great depth. It's by far the most practical guide I've read on the topic so far. πŸ‘

Start the dialog

On management

As a manager, everything is your fault. I know… very positive start πŸ‘€

Companies can drive but also mess with your career. I never thought about it that way, but if you join a new company, you give your new manager the trust that they won't mess with your future.

They trusted you with their career, make sure to keep that trust.

Alex shares thoughts and management advice on his blog.

Learn more about management

CLI tools that are better than their original

A collection of modern/faster/saner alternatives to common unix commands.

Julia Evans asked the Twittersphere about new and modern CLI tools. Folks pointed to the modern-unix GitHub repo. And it's indeed an excellent resource to polish your current CLI setup.

You'll discover that many of these tools are written in Rust. Check out bat, exa and delta! I'm a big fan.

Use modern UNIX

Random MDN – the menu element

menu: The Menu element – The "menu" HTML element is a semantic alternative to "ul". It represents an unordered list of items (represented by "li" elements), each of which represents a link or other command that the user can activate.

From the unlimited knowledge collection called MDN... πŸ₯

What element is semantic super sugar, more than an ordinary list and cross-browser-supported? Let me introduce you to the menu element! πŸ‘

Learn more about the menu element

TIL recap – caption-side

CSS: table {   /* moves the caption to the bottom */   caption-side: bottom; }

Did you know that the caption-side CSS property defines a table's caption position? Now you do. πŸ˜‰

Place your caption

If you learned something new, whether small or big, old or new, documented or not, I'd love to include more learnings in this newsletter. Send me an email, and I'm happy to share your discovery!

Three valuable projects to have a look at

A new Tiny Helper

"Draw something in the box" followed by a drawn and recognized character.

Every time I see shapecatcher.com, I can't get around thinking "Wow! this is useful!". Finding a Unicode character by drawing a sketchy version of it, how cool is that?

Find some Unicode characters

Find more single-purpose online tools on tiny-helpers.dev.

Thought of the week

You read way more code than you write. The Kernighans law's describes the disadvantages of writing "clever" code.

Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it.

A song that makes you stop coding

A dude singing in a microphone

Giant Rooks' "Watershed" is a nice and bouncy Indie track with a great chorus. Enjoy!

Listen to "Watershed"

Thank you for reading!

And that's a wrap for the sixty-third Web Weekly! If you enjoy this newsletter, I'd love you to tell others about it. β™₯️

If you're not a subscriber, you can change that! πŸ˜‰

And with that, take care of yourselves, friends - mentally, physically, and emotionally. I'll see you next week! πŸ‘‹

Was this post interesting?
Yes? Cool! You might want to check out the email version. The last edition went out 7 days ago.

Related Topics

Related Articles