Performances JavaScript tierces

Découvrez l'impact du code JavaScript tiers sur les performances et ce que vous pouvez faire pour éviter qu'il ralentisse vos sites.

Le terme JavaScript tiers désigne généralement les scripts intégrés dans votre site Web qui sont:

  • dont vous n'êtes pas l'auteur
  • Diffusées à partir de serveurs tiers

Les sites utilisent ces scripts à diverses fins, y compris:

  • Boutons de partage sur les réseaux sociaux
  • Intégrations dans le lecteur vidéo
  • Services de chat
  • Publicités iFrame
  • Scripts Analytics et de métriques
  • Scripts de tests A/B pour les tests
  • Les bibliothèques d'aide (par exemple, la mise en forme des dates, les animations et les bibliothèques fonctionnelles)

Les scripts tiers peuvent fournir des fonctionnalités puissantes, mais ce n'est pas tout. Ils affectent également la confidentialité, la sécurité et le comportement des pages, et peuvent s'avérer particulièrement problématiques pour les performances.

Performances

Une quantité importante de codes JavaScript peut ralentir les performances. Toutefois, étant donné que le code JavaScript tiers est généralement hors de votre contrôle, il peut entraîner d'autres problèmes.

Réseau

La configuration des connexions prend du temps, et l'envoi d'un trop grand nombre de requêtes à plusieurs serveurs entraîne des ralentissements. Ce délai est encore plus long pour les connexions sécurisées, qui peuvent impliquer des résolutions DNS, des redirections et plusieurs allers-retours vers le serveur final qui gère la requête de l'utilisateur.

Les scripts tiers rallongent souvent le réseau avec des éléments tels que les suivants:

  • Déclenchement de requêtes réseau supplémentaires
  • Extraire des images et des vidéos non optimisées
  • La mise en cache HTTP est insuffisante, ce qui force la récupération fréquente des ressources réseau.
  • Compression du serveur insuffisante des ressources
  • Plusieurs instances de frameworks et de bibliothèques extraites par différentes intégrations tierces

Affichage

Le mode de chargement du code JavaScript tiers est très important. Si elle est effectuée de manière synchrone dans le chemin critique du rendu, l'analyse du reste du document sera retardée.

Si un tiers rencontre des problèmes de serveur et ne parvient pas à fournir une ressource, l'affichage est bloqué jusqu'à ce que la requête expire, ce qui peut prendre entre 10 et 80 secondes. Vous pouvez tester et simuler ce problème à l'aide des tests à un point de défaillance unique de WebPageTest.

Que faire ?

L'utilisation de code JavaScript tiers est souvent inévitable, mais vous pouvez prendre certaines mesures pour minimiser les effets indésirables:

  • Lorsque vous choisissez des ressources tierces, privilégiez celles qui envoient le moins de code tout en vous offrant la fonctionnalité dont vous avez besoin.
  • Utilisez des budgets de performances pour les contenus tiers afin de contrôler leurs coûts.
  • N'utilisez pas les mêmes fonctionnalités que celles de deux fournisseurs différents. Vous n'avez probablement pas besoin de deux gestionnaires de balises ni de deux plates-formes d'analyse.
  • Auditez et supprimez régulièrement les scripts tiers redondants.

Pour savoir comment auditer des contenus tiers et comment les charger efficacement afin d'améliorer les performances et l'expérience utilisateur, consultez les autres posts de la section Optimisez vos ressources tierces.