RWD Weekly #447

Hello again, welcome back to RWD Weekly #447.

Our feature site this week comes from a course which I’ve signed up for called The ultimate Three.js course. It’s not a sponsored spot so I won’t tell you how amazing the course looks, but I can’t wait to get started and build out my very own little galaxy.

Let’s get linking!


Sponsor

Authority Pro Theme Package

Authority Pro perfectly highlights your knowledge, years of experience, and acquired wisdom. Even if it’s early in your journey toward building expertise and trust, this carefully-constructed design will accelerate how quickly your audience grows.

Article

An Opinionated Guide to Performance Budgets

Performance budgets are one of those ideas that everyone gets behind conceptually, but then are challenged to put into practice – and for very good reason. Web pages are unbelievably complex, and there are hundreds of different metrics available to track. If you’re just getting started with performance budgets – or if you’ve been using them for a while and want to validate your work – this post is for you.

A new history API, “app history”

The web history API is very useful when it comes to most web use cases, but with the rise in webs applications the benefits aren’t always there. There is a new proposed API layers to go on top of the existing API called appHistory.

Web Frameworks: Why You Don’t Always Need Them

There’s a tonne of different ways you can build a site without frameworks these days, but is that the right way to go? I was chatting to a virtual colleague today about how this newsletter got started, and how it’s much easier to build responsive websites today. But, with that ease, it takes me longer to get a project setup then it did with just a HTML page and a CSS file. In making things easier, we’ve just shifted the complexity.

Front-of-the-front-end and back-of-the-front-end web development

Brad has such a good head on his shoulders and I’m nodding along with the breakdown between the ends of web development. I particularly like both being responsible for writing unit tests (which in my opinion is the least favourite part of the work).

No news is… a sign of a stagnating Internet

Apparently if you’re in Australia you’re not allowed to post news links into Facebook any more. This is off the back of the Australian Government passing legislation around what Google and Facebook can republish and the cost to those companies for republishing that content. I can’t see Australia sticking with things the way they are, but it’s a bold move.

A History of the Web in 100 Pages

John Allsopp, who famously wrote a dao of web design, has begun a new project. A documentary about the web told through 100 web pages. This is the first in the series and covers the first three web pages in the list, can you guess what the first one is?

Tutorials

Maximally optimizing image loading for the web in 2021

In this post Malte outlines 8 image loading optimization techniques to minimize both the bandwidth used for loading images on the web and the CPU usage for image display. YAY, performance and images in one tutorial.

How to use and feature-detect CSS grid masonry layout

This post shares what you need to do to get started and implement masonry layout in your sites, and it explains feature detection in CSS and JavaScript. It’s not going into the nighty-gritty details of masonry grid layouts. If you want to dive into the topic, Stefan has included more links at the end of the tutorial.

Understanding Z-Index in CSS

A very clever and informative journey through Z-index using kids, floaty toys, paddling pools, ducks, and lakes. Ahmad breaks these confusing systems down into easy to understand chunks and you always walk away with a better understanding.  If you like this article you’ll love his book too!

Resources & Tools

Prince 14

While I cringe every time someone asks me to upload and link to a PDF on a website, I know there are use cases for people wanting to download a PDF VERSION of something. That’s where Prince comes in, which gets its name from what it does… Print from CSS. There’s a new release which includes, colour emoji and SVG fonts, support for calc(), new column and page float capabilties and formatting with JS.

Github1s

Just add 1s after github and press Enter in the browser address bar for any repository you want to read.

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.