Délai avant interactivité (TTI)

Philip Walton

Le délai avant interactivité (TTI) est une métrique expérimentale permettant de mesurer la réactivité de chargement. Elle permet d'identifier les cas où une page semble interactive, mais ne l'est pas en réalité. Un TTI rapide permet de s'assurer que la page est utilisable.

Qu'est-ce que le TTI ?

La métrique TTI mesure le temps écoulé à partir du démarrage de la page quand ses principales sous-ressources ont été chargées et quand il est capable de pour répondre rapidement aux entrées utilisateur.

Calculer le TTI sur la base d'une performance trace d'une page Web, procédez comme suit:

  1. Commencez par First Contentful Paint (FCP).
  2. Avancez dans le temps sur une fenêtre silencieuse d'au moins cinq secondes, où Fenêtre silencieuse définie comme: pas tâches et pas plus de deux en cours de transfert GET sur le réseau.
  3. Cherchez en arrière pour retrouver la dernière longue tâche avant la fenêtre silencieuse, en vous arrêtant à FCP si aucune tâche longue n'est trouvée.
  4. Le TTI est l'heure de fin de la dernière longue tâche avant la fenêtre silencieuse (ou la la même valeur que le FCP si aucune tâche longue n'est trouvée).

Le schéma suivant devrait vous aider à visualiser les étapes ci-dessus:

Chronologie du chargement d'une page montrant comment calculer le TTI

Jusqu'à présent, les développeurs optimisaient les pages pour un affichage rapide, parfois au détriment de TTI.

Des techniques comme le rendu côté serveur (SSR) peuvent conduire à des scénarios dans lesquels une page semble interactif (les liens et les boutons sont visibles à l'écran), mais ce n'est pas le cas. effectivement interactif, car le thread principal est bloqué ou car le code JavaScript contrôlant ces éléments n'a pas été chargé.

Lorsque les utilisateurs essaient d’interagir avec une page qui a l’air interactive mais qui Ce n'est pas le cas, ils répondront probablement de l'une des deux manières suivantes:

  • Dans le meilleur des cas, ils seront agacés de voir que la page met du temps à répondre.
  • Dans le pire des cas, il supposera que la page ne fonctionne pas partir. Ils peuvent même perdre confiance dans la valeur de votre marque.

Pour éviter ce problème, faites tout votre possible pour minimiser l'écart entre entre le FCP et le TTI. Et dans les cas où une différence notable existe, indiquer clairement à l’aide d’indicateurs visuels que les composants de votre page ne sont pas encore et interactif.

Mesurer le TTI

Le TTI est une métrique la mieux mesurée dans le l'atelier pratique. La meilleure façon de mesurer le TTI est d'exécuter un Audit de performances Lighthouse sur votre site Consultez la documentation Lighthouse sur TTI pour en savoir plus sur l'utilisation.

Outils de l'atelier

Qu'est-ce qu'un bon score TTI ?

Pour offrir une expérience utilisateur de qualité, les sites doivent s'efforcer de prévoir le temps nécessaire Durée interactive de moins de 5 secondes lorsque le test est effectué sur un mobile moyen matériel.

Pour en savoir plus sur l'impact du TTI de votre page sur votre score de performances Lighthouse, voir Comment Lighthouse détermine-t-il votre TTI ? qual.

Améliorer le TTI

Pour savoir comment améliorer le TTI d'un site spécifique, vous pouvez exécuter un Lighthouse un audit de performance et prêtez attention à toute opportunités suggérées par l'audit.

Pour savoir comment améliorer le TTI en général (pour tous les sites), consultez ce qui suit guides de performances: