Une petite introduction technique
Une page internet peut être plus ou moins lourde, ce qui est généralement ressenti par l’internaute en terme de lenteur de chargement. Ce sont généralement les images ou les vidéos qui sont les éléments les plus lourds d’une page (ou d’un email). La fibre optique se généralisant, la très grande vitesse de connexion permet de récupérer rapidement une page, même lourde… mais améliorer les infrastructures pour consommer plus, ce n’est pas la logique la plus écologique. Mieux vaut faire son possible pour réduire le poids d’un site internet : il sera plus rapide pour tous, et en étant plus léger, ce sera ça de moins de consommé.
Car au delà de l’impression de rapidité ou de lenteur sur le l’internaute, une page web est un ensemble de fichiers, stockés sur un serveur. Un serveur est un ordinateur toujours allumé et disponible sur internet. De sorte qu’en tapant https://www.st-esprit.org/, la requête arrive sur un serveur 1&1, dans deux de leurs datacenters (probablement Londres, Francfort ou Berlin). Si ce serveur a beaucoup d’informations (des photos de la braderie, une vidéo de l’homélie…) à envoyer à votre navigateur :
- il doit les stocker en permanence (et il y a souvent de multiples duplications pour être certain de ne rien perdre en cas de problème)
- lors de l’envoi, il solicite d’autant plus les infrastructures.
Par ces deux aspects, la consomation électrique s’en trouve augmentée, et donc, potentiellement, le dégagement de gaz à effets de serre.
La mise en œuvre
Entre le 18 et le 25 octobre 2021, nous avons mis à jour la page d’accueil de ce site pour gagner en rapidité de chargement. Nous avons suivi l’amélioration des performances en utilisant l’outils Pagespeed Insight :
| Date | 18 octobre | 20 octobre | 20 octobre | 25 octobre |
| Score général | 74/100 | 74/100 | 90/100 | 97/100 |
| Vitesse en seconde | 2,5 s | 2,3 s | 0,9 s | 0,8 s |
| Poids en Mo | 6,4 Mo | 4,3 Mo | 3,4 Mo | 1,5 Mo |
1ère étape : réduire les images
Les images étant nombreuses et généralement l’élément le plus lourd d’une page, nous avons ajouté un outil qui en réduit automatiquement la taille, sans pour autant en réduire la qualité (ou alors, juste ce qu’il faut). Il existe également de nouveaux formats d’images plus légers : les photos sont désormais automatiquement proposées dans le format compatible le plus léger.
Détails techniques : nous avons opté pour l’extension WordPress EWWW Image Optimizer, qui propose de parcourir toutes les photos existantes pour les compresser et les convertir en des formats plus récents et plus légers (.webp par exemple).
Résultat : presque 2 Mo de gagné sur la page d’accueil, c’est bien, mais le score reste médiocre…
2ème étape : installer un « cache »
Un système de cache permet de dire au serveur et à votre navigateur que certains d’éléments du site web ne changent pas d’une visite à l’autre. De sorte que le minimum d’information ait besoin d’être envoyé par le serveur. Sur un même site web, il y a beaucoup d’éléments communs d’une page à l’autre, donc la deuxième page visitée profite également du gain de performance : le navigateur a déjà récupéré le logo de la paroisse, et pleins d’autres fichiers qui définissent le style du site (les titres en gras, la police de telle taille et de telle couleur…).
Détails techniques : hésitation entre les grands noms du coaching WordPress, W3 Total Cache ou WP Super Cache, pour finalement opter pour WP Fastest Cache, qui est extrêmement simple à mettre en place, pour des bénéfices immédiats impressionnants !
Résultat : Quinze pour cent de gain sur le score général, et un temps de chargement divisé par deux, génial !
3ème étape : retirer des informations
Même s’il est chargé rapidement, un site de 3,4 Mo reste un gros site, qui sera encore plus lent à charger sur un smartphone. La dernière étape fut donc de réduire la taille de la page d’accueil, qui était très très longue, avec beaucoup d’images (qui souvent n’étaient pas optimisées : une très grande image s’affichait en tout petit). Nous avons déplacé des pans entiers de la page d’accueil vers les pages dédiées.
Résultat : on se rapproche des 100/100, et le poids de la page d’accueil atteint 1,5 Mo. Difficile de faire moins, vu les grandes photos qui sont présentes.
Et l’environnement ?
Est-ce qu’on a vraiment un impact écologique en réduisant la taille d’une page web ? Pour s’en assurer, il nous fallait avoir des statistiques d’usage du site. Sur une semaine, le site compte environ 450 visites sur la page d’accueil, que nous arrondissons à 1800 visites par mois. ainsi, on peut déterminer la bande passante consommée mensuellement par la page d’accueil :
- Avant : 1800 visites x 6,5 Mo = 11,7 Go
- Après : 1800 visites x 1,5 Mo = 2,7 Go
Chaque mois, ce sont donc 9 Go d’économies, de données qui ne sont plus envoyées par le site. Soit plus de 100 Go annuel… Ce qui est malheureusement difficile à concevoir ! On aimerait pouvoir exprimer cette réduction en terme de grammes de CO2 qui ne seraient plus dégagés dans l’atmosphère, mais il n’y a pas de statistique très claire en la matière (d’autant que la France est largement décarbonée).
Alors le mieux est peut-être de se féliciter d’une forme de sobriété heureuse appliquée au numérique (et un petit pas sur la route d’une Église Verte)
Laurent Ghirardotti, séminariste pour le diocèse de Paris et la communauté de l’Emmanuel, ancien développeur web.