Aller au contenu principal
Numérique responsable

Notre engagement
GreenIT

INNOSYS mesure et optimise l'empreinte environnementale de son site. Cette page détaille les métriques actuelles, les actions mises en œuvre et les objectifs d'amélioration.

Audit du 23/07/2026 en production, directement sur www.innosys.fr (Lighthouse, conditions réelles : HTTP/2, Brotli, cache navigateur). Score Performance 100/100 sur cette page. Il ne s'agit pas d'un score EcoIndex.fr officiel (méthodologie différente, non installée) mais d'un proxy Green IT basé sur le poids de page et le nombre de requêtes.

100

/ 100

Performance Lighthouse

124,6

Ko

transférés

10

requêtes

réseau

692

DOM

éléments

Ce que mesure ce score

Le poids de page, le nombre de requêtes et la complexité du DOM sont les trois leviers les plus directement liés à l'empreinte environnementale d'un site : moins de données transférées et moins de calcul dans le navigateur, c'est moins d'électricité consommée à chaque visite, sur chaque terminal.

Repère

Le web en moyenne

Selon le rapport HTTP Archive, le poids médian d'une page web dépasse 2 500 KB avec plusieurs dizaines de requêtes et plusieurs milliers d'éléments DOM.

124,6 Ko

INNOSYS aujourd'hui

124,6 Ko transférés, 6 requêtes HTTP réelles, 692 éléments DOM sur cette page, mesurés en production — largement sous la moyenne du web, grâce aux polices auto-hébergées, à la compression Brotli et à un DOM volontairement simple.

Suite

Prochaine étape

Faire tourner une vraie mesure EcoIndex.fr (méthodologie et dataset officiels), pour situer précisément le site sur cette échelle spécifique plutôt que sur un proxy Lighthouse.

Mesure Lighthouse (Chromium headless), pas une mesure EcoIndex.fr officielle (méthodologie et dataset (nouvelle fenêtre) différents, non installés dans cet environnement) · DOM mesuré dans le navigateur (hors contenu <template> fermé) · Mesurée directement en production sur www.innosys.fr.

Détail des trois indicateurs

Trois métriques mesurées le 23/07/2026 sur cette page, directement en production sur www.innosys.fr (Lighthouse) : trafic réseau, nombre d'appels et complexité de la page.

124,6 Ko transférés Perf. 100/100

Poids de la page (brotli, mesuré en production)

HTML

17.7 Ko

CSS

14.2 Ko

JavaScript

30.6 Ko

Police

47.5 Ko

Images

14.7 Ko

10 requêtes HTTP Bien en dessous de la moyenne du web

Appels réseau (production)

HTML

1

CSS

1

JS

1

Police

1

Images

2

Soit 6 requêtes HTTP réelles, plus 4 icônes SVG intégrées en data: (0 Ko réseau, pas de round-trip HTTP) · Polices auto-hébergées, aucun appel à Google Fonts

692 éléments DOM Levier principal

Complexité HTML

Mesuré en production le 23/07/2026 : 692 éléments (le contenu des menus en <template x-if> n'est pas compté tant qu'ils sont fermés) — en hausse par rapport à la dernière mesure (495, juin 2026), du fait du contenu ajouté depuis (nouvelles sections, breadcrumb, blocs de métriques sur cette page elle-même). Le DOM reste l'axe le moins optimal du site et le principal levier d'amélioration restant.

Optimisations GreenIT livrées

Chaque optimisation est documentée avec son impact mesurable. Sprint GreenIT finalisé le 25 juin 2026.

Images WebP

Conversion logo + équipe + partenaires

15 fichiers convertis de JPEG/PNG vers WebP. Les navigateurs modernes reçoivent automatiquement le format optimal via l'élément <picture>.

Logo

9 KB → 4.7 KB

−49 %

Partenaires (4)

3 300 KB → 275 KB

−92 %

Compression Brotli

nginx fholzer/nginx-brotli · Vite pre-build

Le serveur sert les assets en Brotli (br), algorithme plus efficace que gzip. Les fichiers .gz et .br sont pré-générés au build — aucun CPU serveur consommé en production.

CSS (118 KB brut)

14.9 KB brotli

−87 %

JS (92 KB brut)

30.1 KB brotli

−67 %

Polices hébergées en local

@fontsource-variable/inter · Zéro appel Google

La police Inter Variable (utilisée sur l'ensemble du site) était précédemment chargée depuis fonts.googleapis.com. Elle est désormais auto-hébergée, ce qui supprime 2 appels réseau vers des serveurs tiers et améliore la confidentialité des visiteurs.

En-têtes de sécurité & CSP

Content-Security-Policy activée en production

La Content-Security-Policy est désormais active. Elle restreint les ressources autorisées aux seuls domaines nécessaires (font-src 'self', Google Analytics uniquement) et prévient le chargement de ressources parasites.

prefers-reduced-motion

Respect du choix utilisateur

Les animations décoratifs (particules flottantes, fondus, effets shimmer) sont automatiquement désactivées pour les visiteurs ayant activé la préférence d'accessibilité « Réduire les animations » dans leur système.

Chargement différé (lazy)

Images hors-écran non chargées au démarrage

L'attribut loading="lazy" est appliqué sur toutes les images qui ne sont pas immédiatement visibles. Le navigateur ne les charge que lorsque le visiteur les approche, réduisant le trafic réseau initial.

Réduction DOM — Alpine.js x-if

Menus navigation supprimés du DOM quand fermés

Les trois menus de navigation (mega-menu Services, dropdown Secteurs, menu mobile) utilisaient x-show qui maintient les éléments dans le DOM masqués. Remplacés par x-if sur <template>, leur contenu n'est jamais compté par le navigateur tant que les menus sont fermés.

Mega-menu

~67 éléments

hors DOM

Dropdown

~38 éléments

hors DOM

Menu mobile

~18 éléments

hors DOM

Icônes en CSS mask (0 nœud DOM)

Cartes, boutons et contacts — visuel identique

Les icônes décoratives (cartes services/secteurs, boutons d'action, coordonnées du footer) étaient chacune un couple <svg><path> = 2 nœuds. Elles sont désormais rendues via un pseudo-élément CSS ::before avec mask-image (data URI inline) : aucun nœud DOM, aucune requête réseau supplémentaire, rendu pixel-identique.

Étoiles avis

15 SVG → ★

−28 nœuds

Icônes cartes/boutons

18 SVG → mask

−36 nœuds

Flèches « → »

SVG → texte

−18 nœuds

Efficacité côté serveur

Moins de calcul serveur = moins d'énergie consommée par requête.

Cache Redis

Les requêtes en base de données (paramètres, liste des services, sitemap) sont mises en cache Redis avec TTL 1h–30min. Une visite type ne génère plus qu'1 requête SQL au lieu de 19+.

Assets statiques

CSS, JS et images sont servis avec Cache-Control: public, immutable, max-age=1y. Un visiteur qui revient ne re-télécharge pas les assets déjà en cache navigateur.

Hébergement mutualisé

Le site est déployé sur un VPS Docker à Paris, évitant les aller-retours transatlantiques. L'architecture conteneurisée optimise l'utilisation des ressources matérielles.

Performance 100/100 — le DOM reste le prochain chantier

Poids de page et requêtes réseau sont déjà très sobres (124,6 Ko, 10 requêtes, mesurés en production). Le DOM (692 éléments, en hausse depuis juin du fait du contenu ajouté) reste l'axe le moins optimisé du site.

Réduction DOM x-if + icônes CSS mask — Livré

Menus en <template x-if> (hors DOM fermés) ; étoiles, flèches et icônes converties en texte/CSS mask. Optimisation toujours active, mais compensée depuis par le contenu ajouté sur le reste du site (692 éléments DOM mesurés aujourd'hui en production contre 495 en juin).

Fait

Poursuivre la réduction du DOM

DOM à 692 éléments aujourd'hui en production, en hausse depuis juin (495). Cibles : simplifier les sections riches en cartes et fusionner les wrappers superflus sur les pages les plus chargées.

DOM Moyen

Tree-shaking Alpine.js

Alpine.js complet représente ~40 KB en brotli. N'importer que les composants effectivement utilisés (x-data, x-if, x-transition) réduirait ce poids à ~15 KB.

+1 pt Moyen

Mesure officielle EcoIndex.fr

Le score ci-dessus est un proxy Lighthouse mesuré en production ; il reste à faire tourner l'outil EcoIndex.fr (méthodologie et dataset officiels) pour obtenir une note Green IT normée A à G.

Mesure Faible

Méthodologie : mesure Lighthouse (Chromium headless), proxy Green IT — pas une mesure EcoIndex.fr (nouvelle fenêtre) officielle

Mesuré le 23/07/2026 directement en production sur www.innosys.fr : 124,6 Ko, 10 requêtes, 692 éléments DOM (hors templates fermés), score Performance 100/100