Optimised
Website performance and sustainability.In early May, 2023, the WebPageTest (WPT) team shipped a new feature to the tool. They called it Carbon Control, and boy oh boy was I excited to see it finally land.
A recent post by Adrian Cockcroft raised some sensible counter arguments for why chasing green energy usage for cloud compute might not always be the most climate friendly solution.
CO2.js is one of the tools we’ve created to help developers drive the transition to a fossil-free internet. This article will explain the concepts behind CO2.js, it’s uses, and when other tools might be better options to consider.
A conversation from the ClimateAction.Tech community about self-hosting a website on a solar powered Raspberry Pi.
This week’s newsletter introduces a small Eleventy plugin I built at the end of February 2023.
CO2.js v0.12.0 introduces the ability to customise the figures used in carbon emissions calculations when using the Sustainable Web Design model, paving the way for more case specific carbon emissions estimates.
This week will be a quick look at power usage profiling that's available in Firefox Dev Tools Profiler, and the accompanying CO2e measurements.
Building carbon awareness into products is an important strategy to in the challenge to develop a more sustainable future. In this post, I cover how I used Cloudflare Workers and real-time data to make this website carbon aware.
Existing models for website carbon emissions are good for reaching a ballpark figure of website CO2 emissions. This post goes into some ways to generate more specific, accurate emissions estimates.
This week I’m sharing a beta preview of a tool I’ve been working on. It’s called ReqCheck, and is built to help folks find out where all the different requests made by a web page are served from. I’m hoping it can be a tool for both web sustainability and web performance folks to use when auditing websites.
I’ve been thinking about how we can drive broader change to make the web more sustainable and performant. As I’ll get into, I believe a large part of that comes from the defaults set by the tools and services we use.
This is part two in which I will review the COP27 homepage, looking at it particularly in terms of it's website sustainability profile.
This is part one of two in which I will review the COP27 homepage, looking at it particularly in terms of it's website sustainability profile.
Measuring the carbon emissions of websites and apps is no easy thing. Most tools use the amount of data being transferred to calculate the overall emissions. But to get more detailed, relevant results we need to go beyond just data transfer.
It’s issue 52 of Optimised, which means it’s the two year birthday for this little newletter.
This week I'm sharing an article I wrote for the Issue 4 of Branch Magazine. It is centered around the work I have done with The Green Web Foundation on their CO2.js library.
I share some thoughts on the new proposal put forward by the MS Edge DevTools team for a new “Sustainability” tab to be included in the Edge browser’s DevTools.
In this post we’ll build a simple API to calculate the carbon emissions for digital data transfer using CO2.js and Cloudflare Workers.
Knowing the carbon intensity of the electricity grids in which code runs can allow developers to make informed decisions about where/when to run their code.
This week, I’ll be sharing some of my favourite articles and videos from the recent past.
Performance Insights is a tool by Builder.io which, in their words, allows you to learn what improvements can have the greatest impact on your site's performance.
YouTube embeds can added megabytes of data to a website, even if they are not watched by the user. This post looks at a way to use Cloudflare Workers plus a facade to reduce that initial data load.
This week’s newsletter is a very quick look at the new Opportunities & Experiments features that were added to WebPagetTest over the last week.
I was recently shown a code snippet that that a designer friend implemented on a website to combat flash of unstyled text (FOUT). It did so in a way that could possibly have negative impacts on a visitor’s page loading experience.
I’ve been doing a few audits of late, and one thing that keeps coming up is the use of transition effects on page load (or above the fold content). This week we’ll look at some of the performance pitfalls that can arise from this practice, as well as what you should keep in mind.
Webflow is a great service for designers who want to create amazing websites for clients. It does leave a few things on the table when it comes to web sustainability though. Flowty gives designers who build with Weblow the power to create fast, low-carbon, self-hosted sites in minutes.
I’ve been taken aback by the reception ‘Are my third parties green?’ has received from the community. Since its launch in January the tool has expanded to now include a Directory and public API.
The web makes it possible for businesses to reach audiences well outside of their immediate geographic area. This presents its own set of challenges to ensure online content and experiences remain fast for potential customers around the world.
At Chrome Dev Summit 2021, Google introduced a couple of new potential Web Vitals metrics it’s looking into. One of these, responsiveness, has now begun appearing in the wild.
“Are my third parties green?” is an online tool that checks the sustainability of third-party requests made by any web page. This post provides some insights into how it was built, and what other features are planned.
When looking to optimise for paint metrics (First and Largest Contentful Paint for example), we’re almost certainly going to encounter render-blocking resources. In this post I’ll cover what they are, and some general tips on how to mitigate their impact on page performance.
This week, as we celebrate Lunar New Year here in Taiwan, I’ll be sharing some of my favourite web perf. articles and videos from the past year.
PageSpeed Insights is a free performance testing tool by Google. In this post we’ll cover the basics of testing a web page with PageSpeed Insights, as well as how to understand the different test results.
By using less power, using green power, and buying from green suppliers businesses and individuals alike can reduce their carbon footprint. How would we go about applying this same thinking to website performance and sustainability?
Video is becoming an increasingly critical part of the online experience. So how can you include video on a web page without hurting Core Web Vitals, performance or digital sustainability?
In this post we'll look at how you can use Treo's free Site Speed Report to better understand real-user performance on your site, and make the case for performance in your organisation.
Webflow makes it easy for content creators and marketing teams to build stylish websites fast. But this can come with the risk to publishing a site with poor Core Web Vitals. This issue covers some of the things to look out for when building with Webflow.
A brief update on some of the announcements from the 2021 Chrome Dev Summit, and how they relate to web performance.
With COP26 about to take place in Glasgow, let's take a quick look at how the COP26 homepage holds up in terms digital sustainability. What's its carbon footprint, and can it be improved?
This week we're going to look at a few different ways you can keep track of your site's own real world Core Web Vitals.
As our thirst for data, connectivity, and content grows, so does the portion of global carbon emissions attributed to the internet. In this post, we'll take a look at the steps frontend developers can take to make sites more efficient and better for the planet.
As developers, we're normally building and testing websites on devices with decent specs, so testing how your site performs over a slow network or on a low-powered device is one way to help ensure real world performance.
Taiwan's COVID-19 vaccination website is integral to the government's vaccine rollout plans. This post is a quick website performance audit of the site.
Rather than immediately reaching for JavaScript to handle on-page interactions, why not stop and think Could CSS do that? You'd be surprised, it probably can.
Using resources hosted by a third-party can seriously hurt website performance in a few ways, one of which is the need for the browser to establish a connection with another domain. In this issue, we'll cover how you can use a proxy to reduce the performance impact of this connection step.
Part 2 of this case study explores some of the key code and build step implementations that help to deliver perfect Lighthouse scores and improved website sustainability for my personal website.
Part 1 of this case study explores the design and development decisions I made when redesigning my personal website. These decisions help to deliver perfect Lighthouse scores and improved website sustainability.
WordPress sites make up a big part of the internet, and so getting performance right on them will go a long way towards delivering a better online experience overall.
Something a bit different this week - I'll be sharing some recent web peformance related news and articles that have come out in the past two weeks.
This week I'll be sharing a recent client project I worked on. Hopefully real world examples like these can provide practical insights for tackling performance issues on your own websites.
Performance and accessibility go hand in hand. The overlaps between the two are present in more ways than you might think.
The third and final part of a short series looking at some of the tricks and techniques to consider when optimising fonts for the web.
The first of a short series looking at some of the tricks and techniques to consider when optimising fonts for the web.
The first of a short series looking at some of the tricks and techniques to consider when optimising fonts for the web.
What's the link between a faster website and climate change? In this post I'll explain how you can help the environment by focusing on website performance.
Website analytics provide useful insights into the reach of your online content. However, the analytics on your site can also impact page performance and expose privacy concerns.
This week we continue our look at resource hints, and how you can use them to improve perceived performance.
A brief primer about resource hints. What they are, where, when and how to use them.
This week we'll look at a few ways you can optimise pages on your websites that have Twitter/YouTube content embedded within.
A quick primer on the benefits associated with replacing icon fonts with SVGs
A guide to some techniques that can help with optimising, compressing & serving images.
When it comes to optimising images, the easiest place to start is with the image files themselves. With modern image formats, compression tools, and online services it's easy to shave megabytes off the total size of a web page.
What are Core Web Vitals? What might adding them to the signalling mix for search mean for SEO? And, what can you do to check & prepare your site? Read on to find out!
This issue of Optimised will introduce you to a few tools you can use to test and track website performance.
Optimised is a fortnightly newsletter all about web performance. In this issue we'll be looking at third-party resources.