website icon indicating copy to clipboard operation
website copied to clipboard

Reducing the website's carbon footprint

Open evanzhong opened this issue 4 years ago • 0 comments

One often overlooked aspect of software engineering is power consumption. It's a distanced issue: engineers usually are far removed from the servers and physical machines that host their web application and websites. It's then not surprising that ACM's website has a relatively high carbon footprint.

This is an exploratory ticket for anyone interested in exploring a new facet of software engineering. In addition to thinking about the code in this repository, you'll also have to consider technologies further upstream including how we host the ACM website and what services we rely on. Additionally you can explore profiling to explore the concept of "page weight" and what "first meaningful paint" even means.

Potential first things you can try:

  • Use the Chrome developer tools (inspector) to profile the "page weight" (how much data is sent to a client from a server) on each load of our website
  • Reduce or optimize the images our webpage relies on
    • How often do we rely on CSS to resize images (thus downloading a full resolution image)?
    • Can we compress our images? What file format should we use (exploring WebP instead of JPEG for example)
  • Do an analysis of our font-usage
    • Can we switch to WOFF and WOFF2 file formats instead of TTF and OTF?

If you want to do more

  • Explore file minification on the serverside
  • Run a web page test

Good resources to read over if you're stuck

  • https://webkit.org/blog/8970/how-web-content-can-affect-power-usage/
  • https://www.wholegraindigital.com/blog/choose-a-green-web-host/
  • https://www.wholegraindigital.com/blog/website-energy-efficiency/
  • https://ecograder.com/
  • https://www.smashingmagazine.com/2019/01/save-planet-improving-website-performance/

Thanks to @jasonjewik for bringing up this issue.

evanzhong avatar Apr 26 '21 03:04 evanzhong