Écoconcevoir un service public Web ?

Retours d'expérience sur nosgestesclimat.fr.

note:

  • d'abord montrer les efforts faits sur le build, puis donner le contexte pour montrer les ordres de grandeur ? Mhhh ça demande de trop revoir la prez
  • publier ça sous forme d'article sur datagir/blog

Parmi les résultas google "guide écoconception", la plupart sont des PDF, le premier ADEME de 6Mo (et n'est pas spécifique au numérique). Adoptez un esprit (très) critique.


Le problème


Le numérique consomme une quantité croissante d'électricité, et de ressources matérielles.

L'une des conséquences est la participation accrue au réchauffement climatique.


Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →


  1. Que pouvons-nous faire globalement ?
  2. en France ?
  3. en tant que concepteurs de services (publics) numériques 👈 ?

➡️ Mon retour d'expérience complémentaire aux guides tels que


Qui suis-je ?

Maël THOMAS
Developpeur datagir.ademe.fr via BetaGouv
Dev nosgestesclimat.fr, ex. mon-entreprise.fr

🐦 @maeool


Nosgestesclimat.fr ?

🎯 Estimer en 10 minutes son empreinte climat.
Savoir comment la réduire.

📈 400k simulations terminées.



Numérique * 🌍️

Traitement médiatique et populaire


florilège

Empreinte du visionnage d'une vidéo

Surestimation d'un facteur 10 par le Shift project.


Article publié en 2016 "La 4G est-elle une abomination énergétique" https://www.greenit.fr/2016/03/15/internet-mobile-la-4g-est-elle-une-abomination-energetique/

Cité des centaines de fois, corrigé 5 ans après pour préciser qu'il ne considérait que la consommation du smartphone
(personne n'avait lu l'étude source).


Rapport du HCC (Haut conseil pour le climat) sur la 5G.

Très contestable : critique.

  • 1 To/mois de conso mobile en 2030
  • 1 adolescent sur 2 aura des Google glass.
  • Aucune évaluation de l'empreinte d'une antenne 5G.

-> l'empreinte n'est souvent pas où on croit


Comparaison régulière 💻️ vs ✈️

  • périmètre limité (uniquement CO2, pas GES)
  • oubli du dénominateur (démocratisation)

note: Le sujet de l'empreinte du numérique est miné par les infox, erreurs ou les projections arbitraires, faisant des désirs des industriels une fatalité.


"On va mettre des couleurs beiges, pastel pour que le site donne une impression de légèreté"

🎻



Biais : on s'emploie à parler beaucoup du numérique, car c'est facile de trier ses mails ou de choisir un hébergeur "vert", par rapport à ne plus prendre l'avion.

Mais ça sert (presque) à rien.


Pas encore le framework chiffré pour évaluer l'éco-conception d'un service numérique => bcp d'écoblanchiment.


Concrètement !

  1. Conception vs conséquences de l'utilisation
  2. Matériel ou données ?
  3. Conseils pratiques

note:

Mise en situation : membre d'une équipe qui développe un site Web pour le service public.

Conscient de l'empreinte croissante du numérique, je veux réduire la mienne en tant qu'organisation. Que faire ? Par quoi commencer ?

Je vais parler empreinte climat, car c'est ce que je connais, et qu'accessoirement c'est une urgence.


Conception vs conséquences de l'utilisation


C'est la consommation de masse qui fait l'essentiel de l'empreinte, pas la conception des services qui scalent massivement.

Une équipe de 4 👤 pour servir 100k 👤 ?
Dans ce cas, évaluer surtout la conso induite par le service.

note: S'interroger sur la taille de l'équipe vs son audience.

Si l'équipe ne prend pas l'avion régulièrement pour le boulot, ou la voiture mensuellement, ou n'achète pas un nouvel ordinateur tous les 3 mois, peu d'intérêt de se pencher sur la conso interne.


Il faut bien faire la différence entre les consommations individuels vs communs.

Box foyer vs antenne 5G. Installation de la fibre chez moi vs dans la rue.

Serveur nosgestesclimat.fr vs mon ordinateur.

Voiture vs tram.

note:

Idéalement, on va donc viser une double économie :

  1. les conséquences du service qu'on propose sur la masse
  2. et les besoins pour construire et opérer notre service.

Matériel ou données ?


Si l'on ne devait retenir qu'une chose : produire moins de terminaux.


L'octet est bien ~ immatériel

Focalisation données, qui seraient non immatérielles.

Cette clef faisait la taille d'un doigt pour 4Go. Quelques années après, toujours un doigt, mais 500 Go.

note: Le sujet du numérique dans le débat public s'est énormémént focalisé sur les données, avec le célèbre "le numérique n'est pas immatériel". Eh bien si, il l'est.


sans compter l'effet rebond

En même temps que cette clef a fait x100, les vidéos qu'on regarde en streaming sont passées de 480p à 4k et même 8k.

➡️ Relative stabilité de la conso d'NRJ de l'utilisation


Le matériel

Deuxième facteur : nous (les citoyens plutôt riches mondialement) achetons de plus en plus d'objets numériques.


Mais attention : quand certains choix crééent une inflation du matériel,


d'autres choix sobres en remplacent d'autres.


Il y a un ordinateur dans votre poche


Il ne faut pas diaboliser le 📱smartphone et ✉️ les mails tant que des TV individuelles 8k se vendent.


1000 emails simples = visiter la page Web d’un journal en ligne.
1000 emails simples = 1 seconde d’une vidéo de haute qualité (streaming ou TV)

Trier ses emails ? Pourquoi pas. Le faire en priorité pour l’urgence environnementale ? Absolument pas.


Vous êtes-vous déjà demandé d’ailleurs : pourquoi cette injonction répétée à trier ses mails, et pas les messages des innombrables autres messageries que nous utilisons ? Les SMS, Whatsapp, Telegram, Facebook, etc.

Absence de rationnalité de cette injonction email propreté email.


Ni oublier les ordres de grandeur hors numérique.

Un an de smartphone vs un an de voiture :


Conseils pour une équipe Web

  1. Ayez les ordres de grandeur en tête 🧮
  2. Suivant les bonnes pratiques : 90% du boulot est fait ✅
  3. Hébergez français 🐔
  4. Développez pour mobile 📱
  5. Sortez de votre cadre / militez

Ordres de grandeur

N'essayez pas de calculer l'empreinte climat de votre site, nous n'y sommes pas encore (facteur 100 ?).

Évaluez la métrique objective octets transmis.

Comptez en unité Netflix Orange TV.

20Mbit/s pour une vidéo HD
1h = 3600 s = 72 Go
1 an = 100j * 2h * 72 Go = 14 To

nosgestesclimat.fr fait ~ 1mo à chaque visite (+ illustrations SVG)

Sujet d'amélioration continue : https://github.com/datagir/nosgestesclimat-site/issues/220


2j de travail = 10% de gain
100ko * 10 000 visites / jour = 1Go / jour = 300 Go / an


= 2% des octets d'1 foyer 👥 TV
pour ~ 1 million de visiteurs 👥👥👥


😵


100ko, c'est :

  • des milliers de lignes de javascript.

  • 2% d'une photo prise sur un mobile récent


Gain facile ? Allons-y.

Gain non trivial ? Probablement d'autres priorités.


Respectez les bonnes pratiques


Comme toujours, c'est pas si simple, la mesure des octets est faussée :



La consommation (réseau inter/national - réseau local - appareil) n'est pas linéaire en fonction des octets, contrairement à la consommation d'une voiture.

Quelques réfléxions : https://signal.eu.org/blog/2021/03/09/limpact-environnemental-du-volume-de-donnees-une-arnaque-intellectuelle/


Utiliser nombreuses évaluations plus nuancées de la performance des sites.




Stack nosgestesclimat.fr ?

  • Site statique servi par Netlify en CDN (depuis l'Allemagne 😒 )
  • SPA - gros fichier JS initial, navigation immédiate côté client
  • JS - React - Publicodes

SPA = pas bien ? Pas forcément.

  • Si 1 ou 2 pages visitées (blog), ça semble rentable.
  • Si 20 pages, probablement pas.
  • Faible connexion -> initialisation de 10 secondes plutôt que délai sur chaque clic
  • UX : les gens sont habitués à une expérience immédiate sur mobile (Mobile qui installe des 100 Mo)
  • Pas de pb pour Google
  • Du temps gagné pour l'équipe dev

Réduire "la charge" d'1 site Web, on le fait surtout pour le climat ?

🙅


  1. Pour l'expérience utilisateur
    1. Temps de téléchargement
    2. Temps d'éxécution sur vieux matos
    3. Facture mensuelle

  1. Pour le dieu Google

  1. Parce que c'est un bon investissement
    1. Dette technique
    2. Principes et motivation des développeurs (!!)
    3. Passation

Écologie : juste une bonne raison en plus parmi des dizaines deja existantes.


Hébergez français





Pression sur l'hébergeur : https://answers.netlify.com/t/low-carbon-european-cdn/48784/3


Développez mobile


nosgestesclimat.fr : 60% bureau, 40% mobile.


Ne participez pas à donner envie à vos utilisateurs d'acheter un nouvel ordinateur, et même un premier ordinateur.

N'oubliez pas qu'ils sont sûrement coincés sur un ordinateur d'il y a 5 ans moins puissant que votre iPhone X 12,

qui lance 3 virus et 1 mineur de bitcoin au demarrage.


Commencez le dev de vos nouvelles fonctionnalités pour iPhone 5S.



Ne tombez pas dans le piège IE : vous y perdrez du temps et votre courage.


Faut-il s'imposer de faire un site performant sur Galaxy S4 ?

  • sorti en 2014, il y a 8 ans

  • 🚀 6 secondes pour afficher un site pur HTML très simple (news.ycombinator.com)

Bon investissement ou casse-tête ?


Sortez de votre cadre

Au-delà du super critique, que faire ?

  • Passer une semaine sur de l'écoconception ?
  • Prioriser une nouvelle fonctionnalité qui va dans le bon sens 🌍️ ?

Exemple pratique 1

investissement du temps

Au choix :

  • 1 semaine pour passer de 500ko (compressés) à 300ko
  • 1 semaine pour designer une page de fin + impactante ?

(qui sera vue et partagée par 1000 personnes par jour)


Exemple pratique 2

sobriété vs fonctionnalité


On ajoute des animations via "grosse" bibliothèque facile (framer-motion).

➕ : compétition avec les applis modernes / gains réels d'UX
➖ : des octets et de la complexité en +


Exemple pratique 2

sobriété vs fonctionnalité

On charge le calculateur en Javascript côté client.

➕ : vie privée (pas de serveur !), intéractivité, transparence
➖ : des octets et du temps de parsing en +


  • reconsidérer la stratégie ?
  • reconsidérer son métier ?

Point 1.1 du guide numérique.gouv

Le service numérique répond-il à un besoin qui s’inscrit dans au moins un des objectifs de développement durable ?


Militez


Votre marge de manœuvre est faible dans la conception d'un service numérique.


  • faites le test ➡️ nosgestesclimat.fr
  • vous travailler au sein de l'État ? Influencez la Fabrique de la loi.
  • vous travaillez dans une entreprise ? Influencez-là, organisez-vous.
  • militez

Pas que sur le numérique.



Select a repo