OLED and dark websites = lower footprint ✨
Dark themes use less energy and lead to lower-footprint sites
If you’ve researched digital sustainability and the environmental impact of technology, you might already know that OLED displays use less energy when they display darker content. We’re exploring ways to make Wagtail websites more energy-efficient as part of the grid-aware websites project, and thought it was worth quantifying what kinds of savings dark themes can bring.
The setup
It’s really simple, all you need is a power meter – and an OLED display. Any power meter will do. If you want to do lots of measurements, consider a "smart" plug accessible over WiFi or Bluetooth, that sends data over HTTP or MQTT. The display can be an OLED TV, or a smaller device like the 15.6" 1920x1080 ASUS one pictured above.
The results
For starters, let’ compare the two themes of this website 🥁🥁🥁
We’re at 4.4W of power use for the dark theme, and 7.6W for the light theme. As a point of comparison, the laptop pictured above has a total power draw of about 30W – but including a display that’s 2x the resolution of the one we’re measuring with here. We’re looking at 20 to 40% savings in energy use, just by changing the site’s theme!
Other websites
What’s really interesting is those savings are possible across all kinds of sites, and they can be done in a grid-aware basis: the site looks at how much the energy grid is using renewables, and adjusts its color scheme as needed to use less energy. Branch Magazine is a great example of this concept. Here are two of of the website’s themes:
In this case, the "Moderate" theme of Branch uses 7.9W. The "high intensity" theme uses 6.7W. This is still a light theme so the improvement is more moderate, but it is enough to lower the energy use by 15%! 🌈
New websites
Last year, we were joined by Nandini Arora as part of Google Summer of Code. Her designs for a new Wagtail starter project were heavily optimized to have a low energy use:
This is the best scenario, if the site’s identity can be designed from the ground up with energy consumption in mind. See for example the work of the UK government, Adding sustainability to the Government Design Principles.
Rolling this out to existing sites
With the grid-aware websites project, there is a lot of opportunity to spread the use of those patterns across the industry. For Wagtail sites specifically, we can help standardize how this is implemented so sites can more easily incorporate the improvements. We’ve already worked on estimating the footprint of the Wagtail web. Now those concepts have real potential to significantly reduce that footprint!
If all goes well we’ll get to work on those improvements over the summer (see our Wagtail roadmap). And we have a lot more sustainability improvements concepts in the works – feedback most welcome!
