Durée totale de blocage

Le Total Blocking Time (TBT) est un indicateur de performance web qui mesure en millisecondes le temps pendant lequel votre site internet ne réagit pas aux clics, aux tapotements ou aux frappes au clavier pendant le chargement. Cet indicateur comptabilise toutes les périodes pendant lesquelles le navigateur effectue, pendant plus de 50 millisecondes, des tâches JavaScript qui bloquent l’utilisateur. Un TBT faible signifie que les visiteurs peuvent interagir plus rapidement avec les boutons, les formulaires et les menus. Pour les boutiques en ligne et les sites comportant de nombreux formulaires, un TBT inférieur à 300 millisecondes fait souvent la différence entre une conversion et un abandon.

Comment Total Blocking Time mesure l’expérience utilisateur

Le « Total Blocking Time » (TBT) résulte du fait que les navigateurs ne peuvent effectuer qu’une seule tâche à la fois dans le thread principal. Si une tâche JavaScript lourde dure 200 millisecondes, elle bloque le navigateur pendant 150 millisecondes (200 moins les 50 autorisées). Toutes les périodes de blocage entre le « First Contentful Paint » et le « Time to Interactive » sont additionnées pour calculer le score TBT. Google PageSpeed Insights affiche cette valeur par défaut, car elle constitue un indicateur fiable des données de terrain telles que l’« Interaction to Next Paint ». Une boutique en ligne proposant de nombreux filtres de produits ou un site comportant des animations complexes accumule souvent, sans le vouloir, des tâches bloquantes. Résultat : les visiteurs voient déjà la page, mais ne peuvent pas encore l’utiliser.

Pourquoi le « Total Blocking Time » est désormais un indicateur Core Web Vitals

Google a introduit le TBT en 2020 en tant qu’indicateur de laboratoire corrélé au First Input Delay, l’un des Core Web Vitals d’origine. Depuis 2024, l’« Interaction to Next Paint » remplace le FID, mais le TBT reste le meilleur indicateur prédictif dans des environnements de test contrôlés tels que Lighthouse. Les moteurs de recherche utilisent la vitesse et l’interactivité comme facteurs de classement. Les visiteurs quittent les sites qui réagissent lentement, en particulier sur mobile. Dans la pratique, nous constatons chez nos clients PME qu’une amélioration du TBT de 400 à 200 millisecondes peut réduire le taux de rebond de 8 à 12 %. Cela fait du TBT un indicateur utile pour tous ceux qui souhaitent améliorer leur taux de conversion et leur visibilité.

Ce que le « Total Blocking Time » apporte aux boutiques en ligne et aux formulaires de prospection

Un « Total Blocking Time » (TBT) faible permet aux visiteurs de cliquer, de faire défiler la page et de remplir des formulaires dès que la page s’affiche. Pour les boutiques en ligne, cela se traduit par une réduction du nombre de paniers abandonnés : les clients n’ont pas à attendre avant de pouvoir ajouter un produit ou passer à la caisse. Pour les sites B2B comportant des formulaires de contact, une interaction rapide réduit le risque qu’un visiteur abandonne avant que le formulaire ne réagisse. Dans le cadre de projets de référencement technique, nous optimisons le TBT en fractionnant le code JavaScript, en différant l’exécution des scripts tiers et en supprimant les ressources bloquant le rendu. Le résultat est mesurable : de meilleurs taux de conversion, des sessions plus longues et de meilleurs classements sur Google. Le TBT n’est pas une fin en soi, mais un indicateur montrant que votre site est prêt à passer à l’action dès que le visiteur l’est également.

Le « Total Blocking Time » (TBT) vous permet d’identifier les goulots d’étranglement dans l’expérience de chargement avant que les visiteurs ne quittent le site. Cet indicateur vous aide à hiérarchiser les scripts, extensions ou outils tiers que vous devez optimiser ou désactiver. Voici quatre situations concrètes dans lesquelles le suivi du TBT fait la différence pour les PME néerlandaises.

Optimisation du processus de paiement d’une boutique en ligne pour la conversion mobile

Une boutique en ligne proposant 800 produits et cinq modes de paiement charge souvent des bibliothèques JavaScript lourdes pour les prestataires de paiement, le remplissage automatique des adresses et les outils d’analyse. Si le TBT sur mobile dépasse 500 millisecondes, les clients ne peuvent pas cliquer immédiatement sur le bouton de paiement. Ils voient bien le bouton, mais le navigateur ne réagit pas. Cela entraîne de la frustration et des paniers abandonnés. En mesurant le TBT dans PageSpeed Insights ou Lighthouse, vous identifiez les scripts qui bloquent le thread principal. Il s’agit souvent de conteneurs Google Tag Manager comportant dix balises, de widgets de chat ou d’outils de tests A/B. En chargeant ces scripts de manière asynchrone ou en reportant leur chargement après la première interaction, le TBT diminue de 200 à 400 millisecondes. Résultat : un passage à la caisse plus rapide, moins de rebonds et un taux de conversion nettement plus élevé sur mobile.

Rendre les pages de destination avec formulaires plus interactives plus rapidement

Un prestataire de services B2B disposant de formulaires de prospection sur chaque page d’accueil souhaite que les visiteurs puissent commencer à saisir du texte dès que la page s’affiche. Si le TBT est élevé en raison de scripts de suivi, de chargeurs de polices ou de bibliothèques d’animation, il faut parfois attendre deux secondes avant que le formulaire ne réagisse. Les visiteurs pensent alors que le site est en panne et quittent la page. En surveillant le TBT au cours d’un projet de conception web, vous pouvez identifier les CSS et les scripts JavaScript qui bloquent le rendu. Mesures concrètes : remplacez les bibliothèques d’animation lourdes par des alternatives CSS, chargez Google Fonts en local et différez les pixels marketing jusqu’après le « Time to Interactive ». Une réduction du TBT de 350 à 150 millisecondes améliore immédiatement l’expérience utilisateur et augmente de 10 à 15 % les chances que les visiteurs remplissent le formulaire.

Accélérer les sites WordPress avec des constructeurs de pages et des extensions

Un site WordPress utilisant Elementor, WooCommerce et dix extensions actives accumule souvent du code JavaScript. Chaque extension ajoute ses propres scripts, même sur des pages où ils ne sont pas nécessaires. Conséquence : un TBT de 600 millisecondes ou plus, en particulier sur les pages de produits et de blog. En mesurant le TBT par type de page, vous identifierez les extensions qui ont le plus d’impact. Les coupables les plus courants : les boutons de partage sur les réseaux sociaux, les extensions de diaporama et les widgets de chat en direct. En désactivant les extensions sur les pages où elles ne sont pas nécessaires, en regroupant les scripts ou en appliquant le chargement différé (lazy loading), vous pouvez réduire de moitié le TBT. Dans le cadre de nos contrats de maintenance WordPress, nous vérifions le TBT chaque mois et optimisons la pile d’extensions. Cela évite que de nouvelles mises à jour ne détériorent les performances à votre insu.

Quand le « Total Blocking Time » est-il l’indicateur approprié et quand ne l’est-il pas ?

Le « Total Blocking Time » (TBT) est utile si vous souhaitez savoir pourquoi les visiteurs ne peuvent pas cliquer ou faire défiler la page pendant le chargement. Il s’agit d’un indicateur de laboratoire ; vous le mesurez donc dans des conditions contrôlées, comme avec Lighthouse. Pour l’interactivité en conditions réelles, consultez l’indicateur « Interaction to Next Paint » dans le Chrome User Experience Report. Le TBT est moins utile pour les sites qui utilisent très peu de JavaScript, comme les blogs simples ou les pages d’atterrissage statiques. Dans ces cas-là, le TBT est déjà faible et son optimisation n’apporte que peu de bénéfices. N’utilisez pas le TBT comme seule métrique : associez-le au « Largest Contentful Paint » et au « Cumulative Layout Shift » pour obtenir une vision complète de l’expérience utilisateur. Vous éviterez ainsi d’améliorer le TBT au détriment d’autres Core Web Vitals.