Total Blocking Time

Le Total Blocking Time (TBT) est une métrique de performance web qui évalue la quantité de temps pendant laquelle une page web est bloquée, c’est-à-dire incapable de répondre aux interactions de l’utilisateur, pendant le processus de chargement. Plus précisément, le TBT mesure le temps cumulé entre le First Contentful Paint ( FCP Le First Contentful Paint (FCP) mesure le temps nécessaire pour que le premier élément visible, comme du texte ou une image, apparaisse à l'écran, reflétant ainsi la vitesse de chargement perçue par l'utilisateur. ) (premier affichage de contenu) et le Time to Interactive ( TTI Le Time to Interactive (TTI) mesure le temps qu'une page web met à devenir entièrement interactive, c'est-à-dire quand elle a fini de charger et peut répondre rapidement aux interactions utilisateur. ) (moment où la page devient pleinement interactive), lorsque des tâches longues (supérieures à 50 ms) bloquent le thread Un thread (ou fil d'exécution) est une unité de traitement au sein d'un programme qui permet d'exécuter plusieurs tâches en parallèle, améliorant ainsi l'efficacité et la réactivité des applications. principal du navigateur.

Le TBT reflète la réactivité perçue par l’utilisateur et contribue directement à l’ expérience utilisateur L'expérience utilisateur (UX) désigne la qualité de l'interaction d'un utilisateur avec un produit ou service, en termes de satisfaction, facilité d'utilisation et efficacité. . Un TBT élevé indique que l’utilisateur pourrait essayer de cliquer ou d’interagir avec la page, mais que celle-ci est encore occupée à traiter des scripts ou à charger des ressources, rendant les interactions impossibles.

Les principales causes d’un TBT élevé incluent :

• JavaScript JavaScript est un langage de programmation dynamique principalement utilisé pour ajouter des fonctionnalités interactives aux pages web. Il permet de manipuler le DOM, de gérer des événements, et d'effectuer des requêtes asynchrones. lourd : L’exécution de scripts complexes ou non optimisés peut monopoliser le thread principal, retardant la réponse aux interactions.
• Tâches longues : Des tâches non divisées qui dépassent 50 ms de traitement peuvent bloquer le navigateur.
• Ressources non optimisées : Chargement et traitement d’éléments lourds ou non essentiels en priorité.

Pour améliorer le TBT, des techniques comme :

• Fractionner les tâches longues pour éviter de bloquer le thread principal.
• Optimiser le JavaScript pour réduire la taille des fichiers et prioriser les scripts critiques.
• Lazy loading : Charger de manière différée les éléments non essentiels.

Le TBT est une métrique importante, en particulier pour les utilisateurs mobiles, où les appareils ont souvent des processeurs moins puissants. Il est également utilisé pour évaluer les performances web dans les Core Web Vitals Les Core Web Vitals sont des métriques de Google qui mesurent la vitesse de chargement, l'interactivité et la stabilité visuelle des sites web. Elles sont essentielles pour offrir une bonne expérience utilisateur et améliorer le SEO. de Google.