La latence d'entrée estimée est l'une des six métriques suivies dans la section Performances du rapport Lighthouse. Chaque métrique capture un aspect de la vitesse de chargement des pages.
Les rapports Lighthouse affichent une estimation de la latence d'entrée en millisecondes:
Que mesure la latence d'entrée estimée ?
La latence d'entrée estimée est une estimation du temps nécessaire à votre application pour répondre à l'entrée utilisateur lors de la fenêtre de chargement de page la plus active de cinq secondes. La durée de cet audit s'étend du First Meaningful Paint à la fin de la trace, soit environ cinq secondes après le Time to Interactive. Si la latence est supérieure à 50 ms, les utilisateurs peuvent percevoir votre application comme étant lente.
Le modèle de performances RAIL recommande que les applications répondent aux entrées utilisateur dans un délai de 100 ms, alors que le score cible estimé de la latence des entrées de Lighthouse est de 50 ms. Pourquoi ? Lighthouse utilise une métrique de proxy (la disponibilité du thread principal) pour mesurer la réponse de votre application aux entrées utilisateur.
Lighthouse suppose que votre application a besoin de 50 ms pour répondre complètement à l'entrée utilisateur (de l'exécution des exécutions JavaScript jusqu'à l'affichage physique des nouveaux pixels à l'écran). Si votre thread principal est indisponible pendant 50 ms ou plus, votre application ne dispose pas de suffisamment de temps pour répondre.
Environ 90% des utilisateurs sont confrontés à une latence d'entrée inférieure ou égale à celle signalée par Lighthouse. 10% des utilisateurs peuvent s'attendre à une latence plus élevée.
Améliorer votre score de latence des entrées estimées
Pour que votre application réponde plus rapidement aux entrées utilisateur, optimisez l'exécution du code dans le navigateur. Découvrez la série de techniques décrites sur la page Performances d'affichage de Google. Ces conseils vont du déchargement des calculs aux nœuds de calcul Web pour libérer le thread principal, à la refactorisation de vos sélecteurs CSS pour effectuer moins de calculs, en passant par l'utilisation de propriétés CSS qui minimisent la quantité d'opérations intensives pour le navigateur.
Mesurer manuellement la latence d'entrée estimée
Pour mesurer manuellement la latence d'entrée estimée, effectuez un enregistrement avec la chronologie des outils pour les développeurs Chrome. Pour obtenir un exemple du workflow, consultez la section Limiter le travail du thread principal. L'idée de base est de démarrer un enregistrement, d'effectuer l'entrée utilisateur que vous souhaitez mesurer, d'arrêter l'enregistrement, puis d'analyser le graphique de flammes pour s'assurer que toutes les étapes du pipeline de pixels sont terminées en 50 ms.