Aiming to reduce our footprint and lean towards being a sustainable company, we intend to design our company for it to run with the lowest carbon consumption possible.

 

Building a web product has radically changed in the past twenty years. A lot of new technologies and services are available, our industry has evolved, matured and paid its dues. Web technology has the potential to bring huge benefits to people, but only if we use it wisely… At Sondz, we aim to do so and build it in a way that takes into consideration the challenges our generation is facing. Sustainability is, clearly, one of them.

3 simple facts(1) are useful to measure the footprint of our industry:

  • Communication technology will emit more carbon by 2025 than most countries (except China, India and the US);
  • Renewable energy (only) represented 26.2% of global electricity consumption in 2018;
  • Climate change is expected to cause 250 000 additional deaths per year between 2030 and 2050.

Acknowledging that we are part of the problem is always the first step. If we aim to reduce our footprint and lean towards being a sustainable company, we need to design it for it to run with the lowest carbon consumption as possible. In order to do so, there are 3 steps to take into account in our company journey:

  • How much energy we use to build the product;
  • How much energy we use to serve our product;
  • How much energy our product is requesting on our users’ side.

 

Building Sondz sustainably

In order to build our product, we have been focused on using the right tools to limit our overall energy consumption.

Nowadays, from sketching to design, prototyping to user stories and coding, all the steps involved in developing a digital projects pretty much require some computing. The devices we use to bring our products to life matter. From their production footprint to their energy efficiency, and the way they are recycled, choosing the less carbon footprint is key. For now our trust goes to Apple.

As founders, we have been using our existing hardware. No need for brand new devices: our “old” ones have been the job just fine so far. The pandemic did help a little: we are still waiting for the new generation of Apple products to upgrade the power users in the team (data does require some speed). Meanwhile, our CEO (who is not a power user by our standards) did end up buying a new MacBook Air — after 6 years. No blame here.

When it comes to the software we use, we also try our best to optimize our carbon footprint. Let us give you one example, which may sound geeky to some but is actually quite relevant: whenever possible, we favour dark mode. Before you start making a mental note, the answer is yes: dark mode does save power (2). Indeed, it is both an energy saver, as it turns off most pixels, as well as increasing comfort while spending lots of hours in front of our screens. Which we very much do, as you might have correctly assumed. In the last couple of years, dark mode has become more widely available and is our default choice at every step of the process.

From our design tools (which were logically early adopters) to our servers terminal (no surprise here) to our coding tools (good job Microsoft) and even our task management solution (well done Asana), we spend most of our time in the dark. Well, except while writing this post… (shame on you Google).

To be fair, measuring our footprint is still impossible at our scale, but being conscious of that impact and understanding what actions move us towards achieving a lower carbon footprint is a start.

 

Serving Sondz sustainably

Building an online product implies that it has to be available worldwide 24/7. This industry must-have mechanically implies having a constant electricity consumption from our servers and third party web services. In order to lower our carbon footprint, we had to look at every aspect of how an online product consumes energy, and study each step in order to take the right decision to lower that impact.

Our main server, which gathers our visitors’ web queries and sends them webpages, has to be up all the time. Choosing a sustainable friendly cloud hosting service was the key to lower its impact. We chose Salesforce as they were on their way to becoming net zero(3), and will allow us to track our carbon footprint with their product(4).

But not all the web services we run requires 24/7 activity. We took a look at our stack and rethought our architecture to run as many micro services as possible. We then implemented one virtual server for each of them and set a timeframe for it to run that is as short as possible. That micro service setup allows us to adjust our unused power consumption to the least possible amount.

For example, as we host quite a lot of data, improving our carbon footprint in that key area was a must. In order to do so, we adjusted the server that handles our data to the smallest size possible. This server is therefore way too small to handle the data transformation and update part: that is done using another machine which is up only a few hours every month when update processes are actually required.

On the media side of things, typically the most consuming part of a data-rich website, we decided early that we would hosting as little media as possible on our own servers (logos, icons and default images are about it). For all content-type media, we selected a third party solution that effectively masters our media management: Cloudinary. They store our data in a way that allows them to always serve the smallest size needed for any given media. They also use a content delivery network (CDN) to lower the distance between server and user. Meanwhile, our videos and music embeds are managed by services like Youtube and SoundCloud without us consuming any media storage in the process.

On the delivery side, we are using a third party service that adds both a CDN and cache to our delivery strategy: Cloudfare. As mentioned earlier, CDN’s are an efficient tool in helping reduce the amount of energy needed to provide a file to the end user, although it also consumes more energy as it duplicates the hosting of said file on multiple servers. Cache consumes storage space but reduces queries to multiple servers, and we do know that answering queries uses a lot of processing power. Our assumption for both is that the energy gap between the pros and cons is positive, while it is arguably hard to measure (5). But, again, knowing the problem is the first step toward a solution.

Taking these steps allowed us to greatly improve our carbon footprint — and we still have room for more. Also, that sustainability driven quest comes with the added benefit of reducing our server costs, an argument that might motivate some to readily improve their carbon footprint…

 

Using Sondz sustainably

We are responsible for the product we deliver. We believe that it is our responsibility to provide our users with a low carbon footprint service. We want them to spend as much time as they want on our service without ever feeling bad about it. In order to reduce their footprint, we have taken some actions to reduce the energy consumption our service implies.

The energy usage generated by our web page rendering was our first move. There is a direct correlation between performance indicators and energy saving (6). By optimising our HTML markup, our CSS, our JS React components, we are sending the lightest page possible to our users. Also, in order to consume less energy while rendering, we needed to limit the multiplication of information that the user’s browser receives and has to sort through. Achieving an efficient CSS structure which allows lower energy consumption is an art (7): even if we already did quite a few things in that direction, we still have plenty of improvements listed on our roadmap to better achieve that goal.

To go just a little further on this topic, we send our users data in a progressive way, meaning we only send the data the user needs right now. One of the most weight saving decisions we took was not to load Youtube iframes unless the user completes a journey that confirms its intent. We also group queries to our server whenever possible.

A lighter page means less electricity consumption on the device to render it and less consumption to move its data. Less requests means less back & forth between the device and the server. As a web request goes through tens of servers before reaching the final device, using less requests on lighter pages adds up to an exponential gain in carbon footprint.

Last but not least, you might have guessed it, dark mode. Lately we have been seeing a trend in products embracing the dark side. Sondz did so early this year, and we are really in love with it. The entire team has been running Sondz in dark mode, sometimes even forgetting that not all users see the product the way we do. As it happens, building this dark mode triggered several beneficial changes. On the technical side, it drove us to switch from SCSS variables to CSS variables, thus refining our front end coding. This also meant defining a “dark guideline” (and not just any black with a random bright color accent…), thus refining our global identity. We also implemented our dark mode quite efficiently: our atomic design architecture did make this process more enjoyable! And that’s not even all: the project also triggered improvements for our light mode and a better UX globally. Not too shabby.

 

In short

Building a sustainable company is a possible quest that comes with side benefits at every step. We are looking forward to continuing our search for performance — and adding measuring tools to better evaluate it.

Writing this post also raised a question for our users, 70-80% of whom use light mode: would you want us to set Sondz to dark mode by default or do you still go for the light mode, even if it’s less sustainable?

No pressure.

 


 

(1) https://sustainablewebdesign.org/

(2) http://mobileenerlytics.com/dark-mode/

(3) https://www.salesforce.com/news/press-releases/2021/09/21/salesforce-achieves-net-zero-across-its-full-value-chain/

(4) https://www.salesforce.com/products/sustainability-cloud/overview/

(5) https://link.springer.com/chapter/10.1007/978-3-642-32606-6_6

(6) https://css-tricks.com/thinking-about-power-usage-and-websites/

(7) https://www.smashingmagazine.com/2019/01/save-planet-improving-website-performance/