Bannière cookie et temps de chargement : l'impact sur vos performances

La bannière cookie ralentit-elle le temps de chargement ?

Oui, une bannière cookie peut allonger nettement le temps de chargement de votre site, surtout sur mobile et lors de la première visite. Beaucoup de bannières de fournisseurs connus chargent d'abord un script, puis une configuration, des feuilles de style, des polices, des traductions et des listes de tous les services intégrés, souvent depuis plusieurs serveurs externes. La bannière ne devient visible qu'une fois tout cela arrivé. Comme elle s'affiche sur chaque page et pour chaque nouveau visiteur, ce retard touche précisément la première impression. Pour améliorer la vitesse de votre site web, il ne suffit donc pas de vérifier les images, le thème et les plugins : la bannière cookie doit aussi être contrôlée.

Le sujet est souvent négligé, car la bannière passe inaperçue sur votre propre ordinateur. Vous l'avez fermée depuis longtemps, votre choix est enregistré, et sur le Wi-Fi rapide du bureau, tout se charge vite de toute façon. Un nouveau visiteur sur son téléphone, en réseau mobile, subit en revanche toute la chaîne de chargement : une zone vide, puis la bannière, puis parfois un saut de mise en page. C'est justement ce visiteur qui compte le plus pour les campagnes publicitaires.

Pourquoi de nombreuses bannières cookie sont-elles si lentes ?

Une bannière cookie est souvent lente parce qu'elle charge plus que nécessaire. En réalité, elle n'a pas grand-chose à faire : afficher un texte, proposer deux ou trois boutons, enregistrer le choix et le transmettre à Google et aux autres services. Mais beaucoup de solutions sont conçues comme des plateformes universelles censées couvrir toutes les langues, toutes les juridictions et des centaines de services. Cette polyvalence se paie en temps de chargement, même si votre site n'en utilise qu'une petite partie.

• De nombreux fichiers : le script, la configuration, la feuille de style, la police et le logo sont des requêtes distinctes.
• Serveurs externes : chaque nouveau domaine nécessite une nouvelle connexion avant le premier fichier.
• Fichiers de langue et listes de fournisseurs : de longues descriptions de tous les services sont chargées, alors que peu de personnes ouvrent les détails.
• Script bloquant dans l'en-tête : si le script est chargé de façon synchrone dans le head, le navigateur attend avant de construire la page.
• Pas d'espace réservé : si la bannière s'insère après coup dans le flux de la page, le contenu est repoussé vers le bas.

Chacun de ces points est minime isolément. Mais ensemble, ils forment une chaîne où un fichier attend le suivant. En réseau mobile, ce n'est pas seulement la taille en kilo-octets qui compte, mais surtout le nombre de requêtes et de connexions, car chacune entraîne un temps d'attente.

→ Bannière cookies avec Consent Mode v2 : conforme, sans licence mensuelle

L'impact de la bannière sur LCP, INP et CLS

Une bannière cookie lente dégrade directement les Core Web Vitals, trois métriques avec lesquelles Google évalue le chargement, la réactivité et la stabilité d'une page. Le Largest Contentful Paint (LCP) mesure le moment où le plus grand élément visible apparaît dans l'écran initial. Une valeur jusqu'à 2,5 secondes est considérée comme bonne. Sur mobile, la bannière cookie est souvent elle-même ce plus grand élément, car son bloc de texte occupe une grande partie de l'écran. Si elle apparaît tard, la valeur LCP est mauvaise, quelle que soit la vitesse du reste de la page.

L'Interaction to Next Paint (INP) a remplacé le 12 mars 2024 l'ancienne métrique First Input Delay (FID) et mesure la rapidité avec laquelle la page réagit aux clics. Une valeur jusqu'à 200 millisecondes est bonne. Avec la bannière, deux moments sont critiques : pendant son chargement, son script occupe le thread principal du navigateur. Et après le clic sur « Tout accepter », de nombreuses balises démarrent souvent en même temps. Si la page réagit alors avec un retard sensible, l'INP en pâtit.

Le Cumulative Layout Shift (CLS) mesure l'ampleur des sauts de contenu pendant le chargement. Une valeur jusqu'à 0,1 est bonne. Une bannière posée en couche fixe au-dessus de la page ne déplace rien. Une bannière insérée en haut du flux de la page pousse en revanche tout vers le bas. Le visiteur qui voulait toucher un lien touche alors autre chose. Ces moments sont agaçants et poussent les visiteurs à quitter la page plus vite.

Comment mesurer la performance de la bannière cookie ?

La meilleure façon de mesurer la performance de la bannière cookie est de le faire comme un nouveau visiteur. Pour une première évaluation, vous n'avez pas besoin d'outils spécialisés. Le navigateur Chrome et PageSpeed Insights suffisent. Les conditions sont importantes : sans consentement enregistré, sans cache et avec une connexion similaire à celle d'un téléphone en déplacement.

• Ouvrez PageSpeed Insights en vue mobile et notez LCP, INP et CLS. Les conseils sur le code tiers et les ressources bloquantes citent souvent directement la bannière.
• Dans une fenêtre de navigation privée, ouvrez les outils de développement de Chrome, désactivez le cache dans l'onglet Réseau et réglez la limitation sur « Slow 4G ».
• Rechargez la page et filtrez par le domaine du fournisseur de bannière. Comptez les fichiers et additionnez les kilo-octets transférés.
• Dans l'onglet Performance, démarrez une capture et notez à partir de quand la bannière est visible.
• Répétez chaque mesure plusieurs fois et utilisez la valeur médiane, car les exécutions individuelles varient fortement.

Vérifiez que les extensions du navigateur, comme les bloqueurs de publicité, sont désactivées dans la fenêtre privée, sinon des requêtes manquent et le résultat paraît meilleur que la réalité. Les données de terrain de PageSpeed Insights proviennent de vrais utilisateurs de Chrome sur les 28 derniers jours et réagissent donc avec retard aux modifications. Les données de laboratoire affichées en dessous montrent tout de suite si une modification a un effet.

→ Configurer correctement le Consent Mode v2 : aucune alerte dans Tag Assistant

Ce qu'une mesure sur une page de test vide révèle

Une page de test vide montre la vitesse d'une bannière cookie à elle seule. Il s'agit d'une page sur laquelle rien d'autre que la bannière ne se charge, pour que rien ne vienne fausser le résultat. Trackum a mesuré des bannières dans des conditions fixes : page de test vide, émulation mobile, limitation « Slow 4G », médiane de 7 passages. Sa propre bannière légère était visible après 0,4 seconde. Les bannières de fournisseurs connus apparaissaient après 1,3 à 4,3 secondes et chargeaient pour cela 7 à 15 fichiers, soit 150 à 210 Ko au total.

Sur une page réelle, les valeurs sont différentes car images, polices et scripts concurrencent la même bande passante. Mais la tendance reste la même : moins la bannière a besoin de fichiers et de serveurs externes, plus elle apparaît tôt à l'écran, et moins elle ralentit le reste de la page.

Exemple pratique : entreprise artisanale avec formulaire de contact

Une menuiserie fait de la publicité sur Google Ads pour des placards sur mesure. Le site tourne sous WordPress, les images sont compressées, le thème est léger. Pourtant, PageSpeed Insights affiche une mauvaise valeur LCP sur mobile. L'onglet Réseau montre pourquoi : la bannière charge une bonne douzaine de fichiers depuis deux serveurs externes, dont des traductions pour des langues absentes du site. Ce n'est qu'ensuite que le texte d'information apparaît, et c'est lui l'élément le plus grand sur mobile.

Charger simplement la bannière plus tard ne serait pas une solution. La valeur par défaut du Google Consent Mode v2, l'interface par laquelle les balises Google sont informées du choix du visiteur, doit être définie avant le déclenchement de la première balise. Sinon, des données partent sans consentement. La solution est une bannière légère dès le départ. Après le passage à une version légère, la bannière s'affiche plus tôt, et le formulaire de contact reste correctement mesuré avec et sans consentement.

Comment reconnaître une bannière cookie légère

• Un seul fichier de quelques kilo-octets au lieu d'une chaîne de chargements successifs.
• Aucun chargement depuis des serveurs externes pour les textes, polices ou listes.
• Uniquement les langues dont votre site a réellement besoin.
• Une couche positionnée de manière fixe qui ne déplace aucun contenu.
• Consent Mode v2 intégré directement, sans script supplémentaire.
• « Tout refuser » sur un pied d'égalité avec « Tout accepter », dès le premier niveau.

Une bannière cookie légère n'est pas une bannière au rabais. Elle doit toujours recueillir, enregistrer, prouver et transmettre le consentement à Google et aux autres services. Elle le fait simplement sans détours. Si vous évaluez un fournisseur, chargez une page de test avec uniquement sa bannière et mesurez vous-même, au lieu de vous fier aux promesses commerciales.

Améliorer le temps de chargement sans compromettre le consentement

La bannière de Trackum est un seul fichier de 6,6 Ko, ne charge rien d'autre, est disponible en allemand et en anglais, intègre le Consent Mode v2 et affiche « Tout refuser » sur un pied d'égalité dès le premier niveau. Les preuves de consentement sont stockées dans l'UE sans adresse IP. La bannière coûte 50 € en paiement unique, plus 4,90 € par mois, et elle est déjà incluse dans l'abonnement à 19 € par mois. Tous les prix s'entendent HT.

Si vous voulez d'abord savoir où en est votre site, le check gratuit de Trackum l'analyse dans un vrai navigateur, montre la bannière, le consentement et les balises déclenchées, et indique un prix fixe pour chaque problème détecté. Cela prend environ deux minutes et ne demande aucune inscription.