Artboard 16light, inspiration, solution, idea, innovation,Google Sheets iconSwift icon
Published at
Updated at
Reading time
6min
Web Weekly keeps you up to date, teaches you web development tricks and covers all things working in tech. If you like it, subscribe below.

Happy Sunday, party people! πŸ‘‹

Last week was super busy because of Jamstack conf. We were sponsoring the event, and I had the honor to give a workshop about Next.js and Contentful. It was a lot of work, but now that we have the materials, we might publish a course on the topic next year! πŸŽ‰

I'm looking forward to a chilled week and hope you're all well!

This week's Web Weekly includes:

  • All the web development areas one could know
  • The importance of real user performance metrics
  • New progressive web app features

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

"What should I learn when I want to become a web developer"?

Fundamentals section of the wek skills map.

That's a tricky question because web development includes way too many areas these days. But if someone asks me this question in the future, I'll look at Andreas Mehlsen's web skills project. It's an excellent overview of web development topics, and it includes study resources, too!

Look at all these web skills

Dynamic viewport units

Viewport units explainer graphic.

I shared Bramus' article about the new viewport units in the past, but I came across his explainer again this week. There are so many exciting things coming to CSS these days!

Learn about upcoming viewport units

How to blog

Recently plays a key role in keeping the blog alive: it is a routine. It has been extremely successful in keeping me aware that I had a place to write when I wanted to, and keeping a pulse here even when I haven’t been writing very often.

Oldie but goldie; if you're planning to start a blog, Tom MacWright has some great advice. I love the idea of "Recently posts".

Start blogging today

Lighthouse scores are only half the story

Almost half of all pages that scored 100 on Lighthouse didn’t meet the recommended Core Web Vitals thresholds.

Web performance metrics can be gathered in the lab (your computer, WebPageTest, etc.) or the wild via RUM (real user monitoring). Phil Walton wrote a valuable piece explaining why it's crucial to track real user experience.

Consider RUM monitoring

Why you should own your data – the Slideshare edition

Slideshare dialog that includes a payment opt out

This week I learned that the slide hosting service Slideshare started selling subscriptions. If you host your slides on the service, people now have to pay to download your content!

Sadly, it's just another story that shows the importance of content ownership. As Sara Soueidan said this week, "now might be a good time to owning your little corner of the internet" because no matter how great a platform or service is today, you'll never know what they'll do with your creations tomorrow.

Learn about Slideshare's subscriptions

Life pro tip: treat your phone like a book!

When outside treat your phone like it's a book. You wouldn't open a book during a conversation. You wouldn't be reading a book while driving.

I just love this advice from the deprocrastination.co blog. πŸ’™

Treat your phone like a book

Have you heard of OffscreenCanvas?

OffscreenCanvas is a solution to this. It's API surface is really small: It has a constructor, and a getContext('2d') method. Unlike the canvas element itself, however, it is neatly decoupled from the DOM. It can be used in a worker - in fact, they are tranferrable - you can pass them between windows and workers via postMessage.

I wanted to learn more about OffscreenCanvas for a while but sadly didn't find the time to understand this API's purpose. Luckily, Brian Kardell wrote an article about it! πŸ™ˆ

Speed up your canvas animations

Transitional apps

Rich Harris promiting the hashtag "transitionapps"

My highlight of this year's Jamstack conf: Rich Harris takes a look at today's frontend architectures, explains the terms MPA (I still don't like the term) and SPA, and argues that the best solution is somewhere in the middle.

Will we build transitional apps?

PWA screenshots and shortcuts

Example showing how a PWA installation screen with screenshots looks like.

This month I learned that there are new PWA (progressive web app) features to spice up the installation dialog with screenshots and enable app shortcuts. I'm not very invested in the app space (and don't think every website needs to be a PWA), but these are cool features for sure.

Discover new PWA features

TIL recap: CSS Grid can be used to stack elements

DevSheet explaining how to stack elements using CSS grid

I still haven't adopted this grid functionality entirely, but I learned that CSS grid can be used to stack elements a year ago.

Stack with Grid

Three valuable projects to have a look at

A new Tiny Helper

Screenshot of the Filter blend tool that allows you to play with CSS filters.

If you want to understand CSS filters and blend modes and learn how you can combine them, Filter Blend is perfect for that.

Filter and blend everything

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

A quote to think about

I'm not into programming language discussions (or bashing). But it's a fact that if many people use something, all these people have opinions and complaints.

There are only two kinds of languages: the ones people complain about and the ones nobody uses.

A song that makes you stop coding

Kat Frankie singing.

This week's song is from Berlin local Kat Frankie. "Bad behavior" is a catchy pop song from a great album.

Listen to "Bad behaviour"

Thank you for reading!

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

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

Stay safe, and I'll talk to you next week! πŸŽ‰ πŸ‘‹

PS. I heard the cool kids use RSS. You can find multiple feeds on my site.

Related Topics

Related Articles