Download this PDF slide deck with notes (~ 10mb) | Download the video of this this talk (~25 mins, ~40mb) | Link to the original google slides deck | Visit the synchronised video transcript using Descript
(See the speaker notes for every slide for further notes and accompanying references)
Talk transcript
Below you’ll find the transcript from this talk delivered for FOSDEM 2021. It has a few ‘ums’ and ‘ahs’ cleaned up, but for better or worse, it should be fairly close to the actual spoken words in the talk.
Hello. Welcome to Building A Greener web – Patterns and Tooling for carbon aware web performance.
My name is Chris Adams, and I’m a director of The Green Web Foundation. This talk is recorded, so you can always pause me and play again, but the slide deck for the talk is also online, along with a transcript and all the references I use.
So I should introduce myself. Hello, I’m Chris. For the last 15 or so years, I’ve been working as a kind of environmentally focused tech generalist, doing product management, system administration, design and development, mostly for wacky environmental data startups. So one key theme I’ve been working on, has been understanding, quantifying and reducing the environmental impact of our work as digital professionals.
These days, most of my time is spent working as one of the directors of The Green Web Foundation. aNd if you’d like to work together, my future self should be answering questions in the chat for, FOSDEM, but my details are also here.
So during the 30 minutes I have with you, I hope to cover these three topics. First I’ll introduce the idea of carbon, aware design, and why I think it’s a useful concept for an audience of professional technologists like yourselves.
Next, I want to share with you a mental model I’m working on to help us think about the qualities we would need to see in the in the tools and software we build for a greener, more sustainable industry.
Finally, I want to give you some pointers about where you can learn more about this subject and find others interested in applying these ideas to build a greener web.
Carbon Aware
So why carbon aware? Carbon aware may be a new term to you. If this is the case, the chances are you’re in good company. I only heard it myself last year, but I think it’s a useful one. And I’ll try explaining below.
But before I dig too deeply into thi,. I think it’s worth trying to limit the scope of this talk. As you might have noticed we’re in the middle of a pandemic. And as this cartoon now doing the rounds on social media suggests it’s just one of a number of crises unfolding. The biodiversity collapse happening around us is terrifying. And there is definitely more to sustainability than just carbon.
However, I don’t think I can address these well in a talk relating to web performance. So I’ll focus where I think that there are levers in your work as a professional technologist to do something. So I’m going to focus on carbon. Right. Let’s talk about carbon then. What I’m showing you here is known as the carbon skyscraper.
It’s a useful tool for understanding the extent to which we’ve changed our ecosystem. Rather than show the absolute figure of CO2 in the world. It shows how much the amount of carbon in the atmosphere has changed over time. And in particular, how much in the last 100 years it’s shot, right upwards.
That jump has largely been down to us, taking carbon out of the ground in the form of fossil fuels and burning it for energy. Now that energy has been useful and without it, we wouldn’t have wifi, smartphones, the internet, and so on. But putting that much carbon into the sky has downsides. We’re already seeing how many climate related disasters are happening around us. And as we put more carbon in the sky, they’ll keep getting worse.
So we need to make changes to stop putting this carbon in the sky and actually get it out of the sky.
The sheer scale of the changes facing us now are daunting. And it’s worth remembering these words from the intergovernmental panel on climate change, the IPCC telling us what kind of changes we would need, which was aimed for policymakers.
The words rapid, far-reaching and unprecedented, we used. Now, when IPCC scientists use words like this, it’s basically the equivalent to them grabbing us by the ears, and yelling in our face to get our act together and to stop accelerating towards that iceberg. The science is literally spelling out how much we need to change our society to avoid the worst, now.
So, where does the internet fit into this picture?
Well, most estimates put carbon emissions from the internet and data centers to be responsible for between one and 2% of global carbon emissions. So that’s in the same ballpark as aviation or shipping. Or if you prefer countries, Canada or Germany,
It’s not small.
There are a few reasons for this, but primarily the main one is that it runs on fossil ones, mostly on fossil fuels right now. And every time we use the net, even if we don’t want to, we contribute to climate change. So if we didn’t want it to be a driver of climate change, what would we need to do to change this?
Well, we can look at where we’ve had some successes already for clues.
Moore’s law has been incredibly helpful. We’ve seen massive increases in the usage of compute over the last 10 years, but we haven’t really seen the same growth in total energy usage, as you can see.
And to be honest, I’d argue that 1 to 2% of global emissions for all of the benefits we’ve got so far, has been a pretty good deal. We get a lot of value from the internet. Imagine what this pandemic would have been like without it.
It’s worth looking at why we haven’t seen this growth in energy use though. Most of the gains have come from ever cheaper, ever more powerful hardwa, being able to do more work for the same energy usage, and you can most clearly see this with our transition to the cloud.
10 years ago, most servers were in traditional style data centers, but these days there is a clear shift to larger, more efficient hyperscale cloud ones.
Because these large providers of these data centers work at a greater scale to smaller ones and are able to invest more in the design of the hardware, it means that even if the software running on the the same, they’re able to get much more performance per unit of energy used. However the gains have not just come from hardware, as this paper illustrates.
Before we might’ve been able to rely on Moore’s law to make everything faster, as on average, we managed to double the number of transistors on chips every 18 months. But in the last 10 years, it’s slowed down and we have to rely on changes at the software level to keep providing the improvements.
Now a good example of this might be how hyperscale providers, have used various flavors of virtualization to run their data centers at a much higher rate of utilization than the smaller data centers. You can also see this with the adoption of GPU’s in machine learning, and in our domain as web professionals, you can also see the same thing when browsers began to offload the rendering of pages onto the GPU’s of laptops and mobiles and things like that.
This has implications for us as developers.
If we want increases in efficiency to keep up with our increased use of computing, these increases will need to come from the software layer, which is where we work.
And while efficiency has been a historic lever, it’s not the only one.
It’s helped because we’ve reduced the energy we’ve needed, but that has still come from fossil fuels. Another way to emit less carbon from burning fossil fuels, is just to burn fewer fossil fuels. It’s 2020, and we now have better greener, safer ways to generate energy we need for computing now.
But because so few of us understand the underlying energy systems that our industry relies on, we’re not really aware of the opportunities there.
This is where carbon aware design comes in, and it’s a growing and interesting field. It’s defined as the design of products and services to minimize the carbon emissions resulting from their use, over the lifetime of their existence.
GOLD AND POUR
So if we wanted to apply carbon aware practices to the web, what would they look like?
Well, when working with a field and new to us, having a way to remember the key ideas and principles, I think helps us think about the problems in a new way. And I think we can look to lessons learned by the accessibility community for where we might want to go with this.
And while there are extensive specs that we might refer to in the Web Content Authoring Guidelines, or the WCAG, you’ll often hear the term POUR used by people when talking about accessibility.
People use POUR as a way to help remember what’s important as this, quote suggests. The idea is to create a POUR website to so to speak. If it helps developers memorize his principles, then it is served it’s purpose.
And POUR, if you haven’t heard it before, stands for perceivable, operable, understandable and robust.
Perceivable in that, as obvious as this statement may sound, you need to be able to perceive content on a site to access it. If you can’t see a site because you’re blind. Then you need to rely on other senses to perceive it. Perceivable reminded to design for more than just one sense.
Operable. By comparison is about being able to interact with the site using more than just a mouse and keyboard. If you don’t use mouse, or if you don’t have strong, most motor skills, undo features are particularly important. For example,
Understandable. Understandable might be obvious, but we often still get this wrong.
We might use language that’s difficult to understand, or we might choose to use alternate versions, which also distracting for neurodiverse users. For example.
Robust. Robust might refer to building websites that work in conditions that are less than ideal. If you’ve been stuck, waiting for a few megabytes of JavaScript to download on a phone where you just need some text information, you’ll likely appreciate this.
So POUR and the Web Content Accessibility Guidelines have become a norm in the public sector web, and you’re now seeing the same in the private sector, too.
You might make an accessible website because it’s the right thing to do anyway, but it also turns out to be good for risk reduction on your projects. If designing with accessibility in mind makes it more inclusive and also means you’re less likely to be sued like this example with Domino Pizzas, then makes even more sense to do it.
And I think we’re going to be seeing more like this in the field of websites and sustainability, as the public sector wakes up to the fact that a) often has legal obligations to cut emissions, and b) people figure out that energy powering our digital world has to come from somewhere. And not knowing this is a risk.
You can see signs of this in the UK’s own technology strategy already. Announced last September, there is increasingly explicit guidance on how public money needs to be spent, and what people spending it need to look for in their suppliers when buying any kind of digital service.
So if you want to sell to public sector, this is the kind of stuff that you’ll need to be able to demonstrate more of, that I’ve highlighted here. And just like this has started in the public sector, I think you’re likely to see the same thing happen in the private sector, too.
So inspired by this… what would POUR look like for a greener, carbon aware web?
GOLD
I want to share this question with you, and then I want to try answering it in a way that is hopefully interesting and useful to you.
It’s a work in progress, so I’d really appreciate your feedback to make it better.
I think a possible answer to this question I’ve posed is GOLD, standing for Green, Open, Lean and Distributed.
Let’s look at these in more detail.
Green here refers to using the greenest possible inputs inputs for what we do. It takes energy and carbon to run computers. And we should aim to run them on the greenest energy, we can find.
The act of making computers is also resource intensive, so we should be working to minimize the impact there too.
But in the time I have with you, I’ll focus primarily on the first point here.
We’ve already covered efficiency as a lever for carbon emissions. So, if you can send less data over the wire, you use less energy, which means lower emissions.
Tools like website carbon here and make this really explicit now.
But as we know, the other way to burn less carbon is to not use fossil fuels.
My organization, The Green Web Foundation ,provides the data to check if providers of servers are using green power.
Now green power is a complex subject, but I’ll do my best to provide a useful summary. As a user for electricity, you will usually be drawing it from your national grid. And you don’t have direct control over who puts power into that grid as in how the power is generated.
Moreover, this grid mix changes at different times of day, because it’s not always windy and because solar panels don’t work so well at night.
So if this is the case, how can make a power green, if you’re drawing it from the grid?
There are lots of ways to do this, but the easiest to understand approach, and the one I like the most is the one I’m going to try summarizing here.
You make sure that whoever you work with to provide energy for your computing puts at least as much power into the grid with green power as the power you’ve used coming from fossil fuels. So on average, you end up with a greener grid for everybody, as the amount of renewables increases over time, going into the grid.
Now, this is obviously an over simplification, but if you can keep this idea in your head, it helps. I’ll cover some of the details next.
So far, you might be wondering about how it’s possible to have green power, when it comes from sources that are variable, like I’ve just said. So these charts show increasing levels of resolution for energy from wind in Denmark. And as the quote from Bo Tranberg says, 30% of power per year does not mean 30% of power every hour of the year.
But if over a year, you look at the power, going into the grid from renewable sources that you paid for and it’s more than you’ve taken out, you can arguably say that you’ve been running it on green power. If this is unsatisfying to you, there’s some really interesting work from larger providers like Google and Microsoft in this field now.
This picture comes from Google was new report, 24 seven by 2030. Where they set out a vision for being able to run all their infrastructure on green power, every hour of every day.
That is to always match the power of they draw from the grid with carbon free power going into the grid. They do this a few ways, but one way as you can see is to over-provision renewables and then store the energy in huge batteries. So when there are a few of renewables on the grid, they draw power from those batteries rather than fossil fuels.
There are other benefits of this approach, which I’ll cover later. Finally it’s worth noting that some companies say they run io green power, by just offsetting the carbon emissions from the fossil fuels in the grid mix. While we recognize this at the Green Web Foundation, as some parts of the world just don’t have the regulatory structure to make any of the stuff I’ve described earlier possible, I think there are other approaches which I’ve described that solve the problem, in a more direct and more satisfying way. And I think that’s preferable. But this is a valid way of doing this too.
So we spoke about green as one principle.
Another one would be open.
Because efficiency will increasingly come from us finding opportunities for improvement up and down the stack, I think open is necessary. I use open as an approach because I think it goes beyond open source.
Open data is one example. All around the world, governments expose APIs that list, the carbon intensity of their fuel mix going into the national grids around the world. Kind of like those charts I showed you before. But the internet crosses international boundaries and increasingly we work and connect internationally too.
If you wanted to reduce the carbon footprint of the digital digital infrastructure you used, even if a company wasn’t explicitly a green provider, just by running the infrastructure in places where energy is green, you can make savings in terms of carbon emissions. In fact in the US just switching regions, with AWS can more than halve the carbon emission from your compute. Because one region primarily uses hydro power, AWS West, and one region historically has used coal, AWS East.
You can also use maps like this one, which is electricity map to see when power is green as well. And in addition to where, but I’ll come to that later.
And this is a really good example of open data – the open source project Electricity map. It aggregates real time information of how clean energy is all around the world at different points in time, based on the energy mix, so you can make more informed choices.
If you want to reduce the emissions from data over the wire, there are tools you can use for that. You can use Google’s lighthouse, but I prefer another tool that I’d like to share with you called site speed. It’s in use by the Wikimedia Foundation and a bunch of other companies. And I recommend trying it out.
But what I want to draw your attention to is how it scores different things. It’s seems obvious in retrospect that a huge advertising company might not talk about privacy so much, when talking about how to build good websites, even if it’s important to a lot of us, but your see it mentioned here. And just because a project is open source, it doesn’t mean that the creators interests are the same as your interests.
So I’d argue that open is about being prepared to engage with issues from users and stakeholders, as much as the license itself. And this is one thing that I found interesting about sitespeed is that they do do this. The example I point you to is some work on site speed done last year, to be able to carbon calculation into sitespeed itself.
In March last year, a PR I worked on was merged in to make it possible to understand the carbon burn as in the fossil fuel is burned, when accessing any website. Open allows participation from places you might not expect.
So we’ve covered green and open. Now it’s time to refer to the one you’re more familiar with, which I’m calling lean.
Until we’ve changed how the entire internet is powered will need to rely on efficiency in lot of places for lower carbon emissinos, and we’ll also need to make sure the carbon we do emit counts.
In November Mozilla, it released the first ever sustainability report where they tried to quantify the carbon emissions from the digital services that they provide.
Inside the report they did something really interesting – which is to include emissions from end user devices and data transfer in their calculations.
The results were eye-opening.
More than 98% of their reported emissions come from energy used by users devices as in us. This way of reporting is rare, but totally valid and gives a new perspective and where the responsibility lies when we build digital services that we expect others to use.
If we wanted to measurably affect the energy used and therefore the carbon emitted from their usage, I think tools and resources like energy patterns here is really worth a look.
In addition to being part of Dr. Luis Cruz’s. pHD thesis on green computing, it’s also a website cataloging patterns observed from querying thousands of opensource repos on GitHub, to find examples of these patterns in the wild.
It’s focused primarily on mobile, but many of the patterns apply to other parts, of the tech stack too.
It’s hard to manage things you can’t measure. And it’s also easier to manage things if you can track them over time Sitespeed has a bunch of dashboards tracking stats that you might find useful if you’re starting out with web performance.
And if they’re good enough for Wikipedia, they’re probably good enough to start with for a lot of us too.
But what’s really cool, I think is that since last summer, the new default dashboards also future carbon figures too. Like you can see here.
So we’ve spoken about green open and lean. Now the final one is distributed, which is moving work through time and space to avoid carbon emissions.
This sounds fancy, but it really isn’t. We’ve covered how energy efficient code can be carbon efficient code. I mean, it might know intuitively that running infrastructure in parts of the world with loads of green energy will likely be greener than running it somewhere on running on loads of fossil fuels, so I’ll focus on the time aspect, because I think it’s the most exciting.
I mentioned before that supply and demand is dynamic when it comes to power on the grid. So when it’s sunny and windy, we might have an excess of energy. But the grid still needs to be balanced or bad things happen in general. When this happens, it’s often cheaper for grid operators to pay people to use power than it is to pay people who run power stations to turn down the power they feed into the grid.
This is simply because these power stations have so many moving parts. And this means energy costs can go below zero. Here’s a chart from March last year in the UK showing this phenomenon, sometimes referred to as the duck curve, because, well, it looks like a duck.
If you can design for that, it changes the economics of our work, and we can go from being just consumers of power to active participants in building a greener more responsive grid.
As an aside, if you think this is interesting. This is already something company sell directly to consumers. So if you have stuff that uses a decent amount of power at home, You can time it to get paid, to use it rather than paying to use it. Like these folks here, octopus.
Anyway, back to data centers.
Remember that chart, showing that flat line from Google for data center use when we were talking about them running on renewable power, 24/7? Well, it turns out that data centers have the highest energy density per square foot, of any kind of building – even more than Aluminium smelters.
And if you design them to do so, they can respond quickly to changes the demand on the grid to take advantage of this duck curve.
Google are already doing this. And they talk about this as a planet friendly energy saving measure. But if you can distribute jobs and work through time to run it when energy is cheap and green, you end up with lower carbon emissions, but it can also turn something that used to cost you money into something that makes you money.
This is supposed to be a talk about web performance. So here’s an example of applying these principles of carbon knew I design in production. Last year I worked with the team on a digital magazine, all about the sustainable web, called Branch magazine. We knew that the carbon footprint of data over the wire changes, based on the proportion of renewables on the grid.
So instead of just having a performance budget, we tried designing with a carbon budget. When the wind was blowing and the sun was shining, we’d serve the high bandwidth rich, version. This is when you might use a web worker to download assets in the background and pre-cache stuff as much as you could.
If you already have the content locally, then you don’t need to make any subsequent requests over the network, to navigate around, making it feel faster, too.
Conversely, when the grid was largely supplied by power from fossil fuels. We knew our carbon budget, wouldn’t go so far. So we showed this, but we also designed the site to account for this lower bandwidth scenario.
Every time we’d use an image, we’d have to think about how it would look in the low bandwidth scenario.
Designing this way, forced us to always be able to serve a fast site, but it also had the side effects are forcing us to think of accessibility too, which is a good thing. So if we can send a big photo, and it’s a key part of the story, we then at least need to communicate these ideas with good-looking alt text on the images and so on.
A user could always override this. And if we had already had filled a browser’s cache of content, when energy was cheap and green, then it would make sense to serve the rich images we already have.
But you get the general idea – browsers are really capable of these days!
While, this is a basic example, this principle applies in loads of places. You can do this with downloadable search indexes and so on.
So that’s gold – green, open, lean and distributed.
I said, I’ll provide some next steps.
These are the two I would suggest.
First is to follow the link below to climate action.tech – because next week, there’s a whole campaign starting around the idea of low carbon websites. Being led by Hannah Smith and Luis Cruz, who are both absolute experts in this field.
I help organize this community and I learn so much from being part of it, I think is a single best place, you can go to learn more about this as a subject.
Also these links and twitter accounts and hashtags are the ones I think would be most useful to you. If you want to go learn more. I really enjoy being part of CAT, which is climate action.tech. And if you’d like this talk, I think you would too.
Finally, I’d also recommend visiting the special page for first day on the screen for the sharable version of this talk that collects all the links and sources I’ve referenced.
At the Green Web Foundation we use open data, open source and an open approach to help speed the transition from fossil fuels online.
All of our tools and datasets are free to use. And we’re always looking for folks to work with. If you’d like to get in touch, my details are on this page and hopefully my future self has been making themselves useful, and helping answer lots of questions in the chat.
So, yeah! Thanks for your time, FOSDEM, bye!