Menu Search
Jump to the content X X
Smashing Conf New York

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf New York, dedicated to smart front-end techniques and design patterns.

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

I’ll make it short this week: Thank you so much for the great, constructive discussion last week1 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.

Further reading on Smashing: Link2

News Link

  • This week, Firefox 44 has been released6 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 tools7. 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 Link

Concepts & Design Link

  • 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 beautiful9 and enhance the user experience through it.
Beautiful data visualization10

Data visualization doesn’t have to be boring11.

Tools Link

  • 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 logomono12 you can now automate the process easily to get a great, reliable SVG that works on both types of backgrounds.

Web Performance Link

  • Brad Frost has built a super-simple Performance Budget Builder13. 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 use14, along with a guide on the whole topic15.


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

Accessibility Link

JavaScript Link

Streams in JavaScript22

Jake Archibald explains how we can serve content more efficiently and faster using Streams23.

CSS / Sass Link

Work & Life Link

Go beyond… Link

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

Thanks and all the best,

Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30

↑ Back to top Tweet itShare on Facebook

is a freelance front-end developer and architect and cares about sustainable front-end experiences and ethical choices in life. He curates the WDRL, a weekly handcrafted web development newsletter that thousands of developers love, subscribe to, and donate for.

  1. 1

    Stop linking to Medium, you’re killing the open web:

    • 2

      Anselm Hannemann

      January 29, 2016 7:58 pm

      Hey Anonymouse, as much as I’d love to, I don’t see an alternative. Be sure I always search if this is only a cross-post and link to the original site if it is. But I still want to link great content and can’t make it dependent on some platforms people write on. We should rather try to educate people how to publish elsewhere and maybe should evolve our writing tools so that the experience is as good or even better than on the mentioned site.

  2. 3

    Floating labels in pure CSS is nothing new but that’s still a good reference… here’s an article on CSS Tricks dated 2014:

    • 4

      Anselm Hannemann

      January 29, 2016 8:00 pm

      Right, that’s entirely true. Funnily, I stumbled over the link in my list in a tweet from Chris Coyier mentioning this one as the improvement / better version of what you linked here. Thanks for adding it as a reference here :)

  3. 5

    Brad Frost has constructed a super-simple Efficiency Price range Builder. You just need to enter your private project ambitions to see if you match your performance spending budget or not.
    Given that responsive images are a issue you can (and should) use now in production, we face the problem of resizing our photos in various resolutions, sizes and qualities. There are some neat server integrations that support you with that, nonetheless, for numerous instances, it is nevertheless a difficulty. Fortunately, there’s now an open source tool you can use, along with a guide on the complete subject.

  4. 6

    Chrome 48 is stable since Jan 20, and the Security tab is right there in the dev tools. ;)


↑ Back to top