About The Author

Anselm is a freelance front-end developer who cares about sustainable front-end experiences and ethical choices in life. He writes the WDRL, and is co-founder … More about Anselm

Web Development Reading List #122: A Performance Budget Builder, Streams, And The Web Push API

This week, Firefox 44 has been released to the public. The new version offers better video support (VP9, WebM in addition to h.264) and adds support for Brotli compression (a new, better compression than gzip) for HTTPS connections. Service Workers are also supported now. The new Chrome Beta channel build now includes a security panel in the developer tools. This panel shows you how secure your site is, including details on HTTPS and mixed content warnings. Unfortunately, it’s not super detailed yet, and it also doesn’t provide information like HSTS, HKPK and other security details, but I’m excited to see this and bet that they’ll integrate more features over time.

I’ll make it short this week: Thank you so much for the great, constructive discussion last week about hiring people and web development basics. I took away some very interesting thoughts from it, and I hope you did so, too. Now, let’s go through the newest things I found.

News

  • This week, Firefox 44 has been released to the public. The new version offers better video support (VP9, WebM in addition to h.264) and adds support for Brotli compression (a new, better compression than gzip) for HTTPS connections. Service Workers are also supported now. Furthermore, the new Firefox requires add-ons to be signed and it doesn’t connect to sites anymore that allow RC4 ciphers in their HTTPS configuration.
  • The new Chrome Beta channel build now includes a security panel in the developer tools. This panel shows you how secure your site is, including details on HTTPS and mixed content warnings. Unfortunately, it’s not super detailed yet, and it also doesn’t provide information like HSTS, HKPK and other security details, but I’m excited to see this and bet that they’ll integrate more features over time.

General

Concepts & Design

  • Most of the time, we see boring data visualizations. But they don’t have to be boring — instead, with inspiration from artists, we can make data very beautiful and enhance the user experience through it.
Beautiful data visualization
Data visualization doesn’t have to be boring.

Tools

  • If you already have your logo as an SVG file, you might want to optimize it not only for bright but also for dark backgrounds. With logomono you can now automate the process easily to get a great, reliable SVG that works on both types of backgrounds.

Web Performance

  • Brad Frost has built a super-simple Performance Budget Builder. You just need to enter your personal project goals to see if you match your performance budget or not.
  • Since responsive images are a thing you can (and should) use now in production, we face the problem of resizing our images in various resolutions, sizes and qualities. There are some neat server integrations that help you with that, however, for many cases, it’s still a problem. Luckily, there’s now an open source tool you can use, along with a guide on the whole topic.

HTML / SVG

  • Many people don’t know that the hidden HTML-attribute has quite decent browser support. Steve Faulkner explains how you can use it and also describes other attributes to properly hide elements.

Accessibility

JavaScript

Streams in JavaScript
Jake Archibald explains how we can serve content more efficiently and faster using Streams.

CSS / Sass

Work & Life

Go beyond…

And with that, I’ll close for this week. If you like what I write each week, please support me with a donation or share this resource with other people. You can learn more about the costs of the project here. It’s available via E-Mail, RSS and online.

Thanks and all the best, Anselm