IT is not green: 4% of greenhouse gas emissions came from the digital industry in 2020, and this number is only going up. [Ademe20] Broad solutions won't come from individual developers, they depend on global policies between governments and the large tech industry.
While keeping this bigger picture in mind, we, as developers, are not powerless. There are ways to design websites and applications that have a better impact on the environment, albeit not as drastic as we would like them to be.
Think of it as recycling your trash or turning down the heat in your house: it is not going to solve climate change by itself, but it is necessary to raise awareness among our peers, and it might have an impact once it becomes the norm.
In France, about 75% of the carbon footprint of a phone comes from its manufacturing. [Ademe 2017]
Easy, so we need to prevent people from replacing their phones.
What makes people want to change their phone? Frustration: oftentimes, it is because their battery does not last longer than a day.
What shortens the longevity of a full charge? Too many charges.
This is what this post comes down to: how do you responsibly design an app to limit the battery drain it creates, thus preventing too many charges and extending the phone life?
Geolocation is a feature that can be very nice to have on a lot of apps: displaying shops in the vicinity, calculating itineraries, etc. However, the GPS technology was not designed to save battery. Continuous GPS requests can discharge your phone up to 23 times faster than if it were turned off. [Oshin, T, Ma, A, Poslad, S, 2012].
Two actions are in your hands:
Here's how you can set the default to coarse in native:
In React Native, you can use the react-native-permissions library to handle both operating systems and set the localization permissions to coarser accuracy.
On Android, go to your AndroidManifest.xml file and only give access to coarse location.
++pre>++code class="has-line-data" data-line-start="35" data-line-end="41"><manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="yourapp">
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
</manifest>
++/code>++/pre>
instead of using ++code>ACCESS_FINE_LOCATION++/code>.
On iOS, add the following to your ++code>info.plist++/code>
++pre>++code class="has-line-data" data-line-start="48" data-line-end="51"><key>NSLocationDefaultAccuracyReduced</key>
<true/>
++/code>++/pre>
The smartphone-screen industry is shifting towards AMOLED technology, gradually replacing LCD screens. While LCD provides a LED backlighting (thus consuming equally for all colors), the light in AMOLED screens comes from the pixel itself and the consumption is not uniform.
A comparative analysis on AMOLED screens lead Olivier Philippot, from Greenspector, to these conclusions:
Start by allowing users to pick a black theme, or make it the only available theme.
In React and React Native, you can design your themes using React Navigation, providing both Light and Dark modes, either forced or based on the mode your phone is set to.
Slack did it, you can do it too!
Secondly, design your app with accessible colors so that users don't have to cramp up brightness to properly appreciate the contrast.
Basic do and don't
Not unlike geolocation, Bluetooth and other wireless short-range technologies multiply the potential functionalities for your app. But likewise, Bluetooth can be a real battery pit for your phone.
A not-so-famous alternative is Bluetooth Low Energy (BLE) which can consume from 2 to 100 times as less as regular Bluetooth. With a bitrate just half as fast as regular Bluetooth, it is completely suitable for most purposes that do not require high fidelity transfer. Basically, as long as you're not streaming music, you can go for BLE: Smart home, fitness apps, wireless mouse, you name it.
++table style="width: 100%; border-color: #99acc2; border-style: solid; border-collapse: collapse; table-layout: fixed;" cellpadding="4" border="1">++tbody>++tr>++td style="border: 1px solid #9e9e9e; width: 33.2734%;"> ++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">Bluetooth Basic Rate++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
Bluetooth Low Energy
++/td>++/tr>++tr>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
Application throughput
++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
0.7-2.1 Mbit/s
++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
0.27-1.37 Mbit/s
++/td>++/tr>++tr>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
Power consumption
++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
1 W as the reference
++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
0.01-0.50 W
++/td>++/tr>++tr>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
Primary use cases
++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
Mobile phones, gaming, headsets, stereo audio streaming, smart homes, wearables, automotive, PCs, security, proximity, healthcare, sports & fitness, etc.
++/td>++td style="border: 1px solid #9e9e9e; width: 33.2734%;">
Mobile phones, gaming, smart homes, wearables, automotive, PCs, security, proximity, healthcare, sports & fitness, Industrial, etc.
++/td>++/tr>++/tbody>++/table>
A few facts about Bluetooth Low Energy [Wikipedia]
In React Native, you can easily implement it with this highly-contributed library.
As an example, here's how you do it on Android. Just add the following lines to your manifest:
++pre>++code class="has-line-data" data-line-start="87" data-line-end="95"><uses-permission android:name="android.permission.BLUETOOTH"/>
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN"/>
# <!-- Required only if your app isn't using the Device Companion Manager. -->
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-feature android:name="android.hardware.bluetooth_le" android:required="false"/>
++/code>++/pre>
You can also use Near-Field Communication (NFC), the technology used for credit cards: it consumes even less and only requires one active device. Apple has recently opened its NFC technology (already available for Apple Pay) to iOS developers, which now makes it supported by both Android and Apple.
Try it out in React native with this library.
Keep in mind that older devices (built before 2015) might not support NFC.
In Ecodesign, less is more. I pointed out a few examples of what you can do, but what you should really capitalize upon from this blog post is as simple as asking yourself this:
Do I really need this feature?
If so, what can I do to implement it responsibly?
The greenest feature is always the one you don't code, but since we are developers, we might as well find solutions to have a better impact while coding.