HELIOS : Réduction de l'impact écologique du service numérique d'un établissement de météorologie et de climatologie
Nous revenons tous deux d'un semestre à l'étranger dans deux pays avec une météo très distincte. En Norvège la météo était particulièrement changeante et extrême par moments. Consulter la météo chaque jour est devenu une habitude, de même que la programmation journalière d'une notification récapitulative.
Aussi, nous nous sommes rendus compte que les habitudes de consommation des services de météo sont très différentes selon les régions du monde et leur climat. Dans les pays aux climats extrêmes, les habitants consultent plus régulièrement ces services pour prévenir les averses ou évènements climatiques (orages, ouragans, canicules, etc). Avec le dérèglement climatique, le nombre de ces évènements ne va qu'augmenter, ce qui fait que le nombre de potentiels utilisateurs ne va cesser de croître (source: Courrier International).
Météo France est le principal service de météo en France avec plus de 11 millions utilisateurs mensuels. C'est une référence en la matière, mais en remarquant le poids et la complexité du site, nous nous sommes attachés à concevoir une alternative avec un plus faible impact environnemental.
A une époque où la situation climatique est de plus en plus incertaine et changeante, se renseigner sur la météo est primordial. De plus, regarder la météo du jour est une action quotidienne pour des millions d'utilisateurs et touche un large public. En plus d'informer sur la météo nationale, un tel service se doit de sensibiliser sur le réchauffement climatique et les catastrophes météorologiques qu'il cause.
Météo France est un établissement public à caractère administratif (source : Météo France) chargé de missions en matière de sécurité météorologique des personnes et des biens. C'est un établissement qui remplit une mission d'intérêt général sous contrôle de l'Etat. Son service numérique est donc reconnu pour son utilité sociale.
L'histoire des prévisions météoroligiques est relativement jeune et connait son avènement avec l'informatique et les satellites. Avant le Web c'est via la presse écrite et la radio que les prévisions étaient communiquées. Désormais c'est via des applications mobiles principalement qu'elle est diffusée. On en comptait plus de 10 000 en 2023 et ce nombre ne va cesser d'augmenter. Cependant l'énorme majorité des services se basent uniquement sur l'un des cinq modèles ouverts suivants :
- Modèle européen ECMWF,
- Modèle américain GFS,
- Modèle français Arome (Méteo France),
- Modèle français Arpège (Méteo France),
- Modèle allemand Icon.
En 2022 le marché mondial des services de prévisions météorologiques pesait 2,20 milliards d'euros, et c'est un chiffre qui est attendu à la hausse pour les années à suivre (source : Statista).
L'impact écologique de cette substitution du papier et de la radio par les applications mobiles est compliqué à établir. Néanmoins étant donné le changement des habitudes de consommation des utilisateurs et la multiplication des plateformes météo, il paraît pertinent de proposer une alternative plus sobre. Avec l'essor de l'IA, les GAFAM s'intéressent également à la prévision météorologique pour tenter de produire des modèles toujours plus précis. Ces petites améliorations de performance ne sont pas forcément nécessaires et ont un fort impact environnemental car elles nécessitent de nombreux serveurs et équipements numériques.
Notre premier axe de travail sera dirigé autour des publicités du site de météo france. En effet, le site contient de nombreuses images et vidéos provenant de publicité ainsi que des "pop-ups". Pour réduire l'impact écologique de la page, mais aussi réduire le temps de chargement, il nous paraît pertinent de les supprimer pour obtenir une page plus épurée. Dans un second temps, nous souhaitons également enlever la grande majorité des articles en fin de page. Sur la page d'accueil du site, la seconde partie est uniquement constituée d'articles avec une image ou vidéo pour le présenter. Toujours dans la même optique, nous souhaitons rendre la page plus pertinente et moins énergivore en ne laissant qu'un article. De ce fait, l'utilisateur aura plus de chances également de s'intéresser s'il n'est pas submergé par la quantité. Toujours pour les mêmes raisons, nous allons remplacer la carte de france qui est l'élément central de la page. Il sera possible par exemple de la remplacer par un tableau des températures et conditions météorologiques tout au long de la journée. Enfin, l'application se doit également d'être accessible et pertinente pour le plus grand nombre. Ainsi, nous ajouterons une partie professionnelle, notamment avec la météo agricole pour les utilisateurs qui auront besoin d'informations complémentaires et plus précises pour centraliser les informations dans un même endroit.
- L'utilisateur de météo en ligne se rend sur la page d'accueil grâce à un favori (donc sans passer par un moteur de recherche). Il cherche l'onglet météo de sa région.
- Il choisit de voir la météo de sa région.
- Il consulte la météo du lendemain et des jours prochains.
Les résultats de performance sont assez différents entre Météo France, Yr et la Météo Agricole. Météo France et la Météo Agricole ont beaucoup de pubs et de cookies qui alourdissent la page et augmente le réseau nécessaire.
- L'utilisateur de météo en ligne se rend sur la page d'accueil grâce à un favori (donc sans passer par un moteur de recherche). Il consulte les titres.
- Il choisit un des articles et le lit en entier.
- Il choisit un autre article à consulter parmi ceux présents en bas.
- Il le lit jusqu'au bout
L'EcoIndex d'une page (de A à G) est calculé (sources : EcoIndex, Octo, GreenIT) en fonction du positionnement de cette page parmi les pages mondiales concernant :
- le nombre de requêtes lancées,
- le poids des téléchargements,
- le nombre d'éléments du document.
Nous avons choisi de comparer l'impact des scénarios sur les services de quotidiens nationaux de diverses sensibilités politiques, économiques et environementales :
- Météo France,
- Yr,
- Météo Agricole.
Les résultats sont les suivants (attention, d'une journée à l'autre, on peut observer une certaine variabilité) :
- Scénario "Consulter la météo de ma région",
- Scénario "Lire des articles parmi les articles de la page d'accueil".
Au vu des différents services comparés, des exigences environnementales exprimées plus haut et des scénarios retenus, nous avons défini pour notre prototype une maquette de l'interface et un échantillon de données réalistes.
L'interface retenue est composée de deux types de "pages Web" :
- celle d'accueil, contenant la météo du jour des principales villes françaises,
- celle qui donne plus d'informations sur la météo d'une zone donnée ("interface pro").
Fig.1: Maquette de l'interface d'accueil du prototype
Fig.2: Maquette de l'interface pro du prototype
Pour des raisons de respect des droits d'auteurs, nous utilisons des données générées (avec dummy-json).
Bien que fictives, ces données correspondent à la structure des services concurrents : 3 villes comportant la météo pourchacun (température, vent, météo) sur 7 jours (voir modèle de données).
Dans un objectif de sobriété environnementale, les articles sont limités à ceux du jour et de la veille.
Pour cette première version du prototype :
- l'échantillon de données est encore chargé dans le code de manière statique,
- les fonctionnalités implémentées ne sont que celles nécessaires pour suivre le scénario prioritaire ("Consulter la météo").
Ce scénario nécessite de pouvoir naviguer sur la page principale qui contient la météo du jour. On se sert ensuite de la barre de recherche pour trouver la météo de la ville qui nous intéresse.
Nous avons donc développé la page d'accueil pour qu'elle affiche un échantillon de données météo sous la forme d'un tableau, comme prévu par la maquette. Elle affiche la météo du jour pour 3 villes si aucune recherche n'est faite (cf. Fig. 3) et affiche la météo de la semaine si l'utilisateur recherche une ville en particulier (cf. Fig. 4)
Fig.3: Prototype de la page principal
Fig.4: Prototype de la page principal avec une recherche
Pour l'instant, nous avons choisi le framework de mise en page minimaliste (PicoCSS). Dans la suite du projet, nous verrons si l'impact environnemental du passage à un framework de mise en page plus puissant (comme Bootstrap ou Tailwind) est acceptable.
Nous avons choisi une librairie qui permet l'import d'icones pour afficher de manière plus ludique la météo. Par la suite, nous étudierons l'impact de l'utilisation d'une librairie par rapport à l'import des fichiers .svg dans le projet.
Nous avons décidé, contrairement à l'ensemble des services concurrents, de ne pas surcharger la page d'informations, d'articles ou encore d'une carte interactive qui nécessite beaucoup de ressource. Si de telles fonctionnalités devaient être introduites, il faudrait mettre en balance leurs utilités et leurs impacts a priori important.
Dans l'état actuel du prototype, il est possible d'avoir une première idée de l'impact environnemental du frontend. Bien entendu, il manque encore le chargement dynamique des données, mais nous pouvons déjà évaluer l'impact de l'affichage des données et du framework (au sens large : React, PicoCSS, DayJS). Cette évaluation de l'impact (cf. Tab.1) est déjà encourageante en mode "développement" mais encore plus en mode "pré-production". Nous mesurons ici l'effet positif de l'adoption d'outils de développement Web intégrant la "minification" (cf. Wikipédia) du code et la concaténation du code d'une part et des feuilles de style d'autre part.
| EcoIndex | GES (gCO2e) | Taille du DOM | Requêtes | Taille de la page (ko) | |
|---|---|---|---|---|---|
| Mode "développement" | 76 B🟢 | 1,4 | 64 | 24 | 4609 |
| Mode "pré-production" | 93.06 A🟢 | 1,14 | 61 | 4 | 76 |
Tab.1: Évaluation de l'impact du prototype de la page d'accueil.
Avec l'ajout de ce modèle de page et la mise en place de la navigation entre les deux modèles, il devient possible d'exécuter le scénario prioritaire complet et de mesurer son impact.
| EcoIndex | GES (gCO2e) | Taille du DOM | Requêtes | Taille de la page (ko) | |
|---|---|---|---|---|---|
| 1. Consulter la météo des villes de l'accueil | 93.06 A🟢 | 1,14 | 61 | 4 | 76 |
| 2. rechercher une ville | 91.15 A🟢 | 1,77 | 97 | 4 | 102 |
| 3. Revenir à l'acceuil | 91.15 A🟢 | 1,77 | 97 | 4 | 102 |
Tab.2: Évaluation de l'impact du scénario "rechercher la météo d'une ville" dans le prototype n°1.
Prototype n°2 : Fonctionnalités pour le scénario prioritaire avec données statiques chargées de manière dynamique
Pour cette deuxième version du prototype, les données (toujours statiques) sont désormais chargées par le frontend à travers le réseau immédiatement après un premier affichage à vide. Ce comportement, plus réaliste, n'a pour effet qu'une requête supplémentaire par page affichée.
Concernant l'évaluation de l'impact environemental du scénario, par rapport au tableau précédent (cf. Tab.2), à l'exception du nombre de requêtes qui est incrémenté de 1, les résultats sont strictement identiques. D'ailleurs, à partir de cette version, et à moins de changements profonds, l'EcoIndex ne devrait plus évoluer de manière significative. Nous utiliserons désormais un autre logiciel, GreenFrame, qui évalue non pas l'impact "environné" de la consultation (incorporant une participation au cycle de vie du terminal) mais celui de la consultation proprement dite (cf. Tab.3) et de manière beaucoup plus fiable à partir des statistiques d'utilisation des ressources physiques (CPU, mémoire, réseau, disque).
| Impact de la consultation de la météo | |
|---|---|
| Meteo France | 302 |
| Meteo Blue | 183 |
| Meteo Agricole | 80 |
| Yr | 41 |
| HELIOS | 31 |
Tab.3 : Impact en mg CO2e de la consultation proprement dite des pages des services existants et de notre prototype.
Pour les services existants, sur le graphique présentant l'utilisation dans le temps des ressources (cf. Fig.4), on constate d'autres pics que le pic initial, probablement associés au chargement et à l'affichage de contenus multimédias et de publicités, ou causés par des techniques de pistage sur le Web.
Fig.5: Consommation de ressources lors de la consultation de la page météo météo france.
Pour notre prototype, au contraire, le graphique (cf. Fig.5) présente un unique pic significatif de consommation de CPU et de réseau. Notons par ailleurs que le pic de CPU est 40 fois plus faible que celui de la figure précédente. Par ailleurs, nous remarquons que cette consommation ne compte que pour 3% de la consommation totale, le reste étant consommé par l'écran durant la durée de la mesure.
Fig.6 : Consommation de ressources par le navigateur lors de la consultation de la météo dans notre prototype.