.

Async

Que signifie Async et comment est-il utilisé ?

Le terme "Async" (abréviation de "asynchronous") est utilisé dans le développement web pour décrire un attribut dans la balise <script> qui permet l'exécution de scripts JavaScript de manière asynchrone.

Cela signifie que le script est téléchargé et exécuté indépendamment du chargement du document HTML. Contrairement aux scripts traditionnels qui bloquent le chargement et le rendu de la page, un script asynchrone est exécuté parallèlement au chargement de la page.

Scanner de risque gratuit de cookie, DSGVO et TDDDG

Quel est le risque d'amende pour votre site web ? Saisissez dès maintenant l'adresse de votre site web et faites déterminer quels cookies et services tiers présentent des risques.

Pourquoi utiliser l'attribut async ?

L'attribut async est utilisé pour améliorer les performances des sites web. Comme les scripts asynchrones ne bloquent pas le chargement de la page, le contenu s'affiche plus rapidement, ce qui améliore considérablement l'expérience utilisateur.

Cela est particulièrement important pour les sites web qui utilisent de nombreux scripts externes, comme les codes de suivi ou les publicités.

Quels sont les avantages de l'utilisation d'Async ?

  • Accélération du temps de chargement des pages :
    Les scripts asynchrones se chargent et s'exécutent parallèlement au reste de la page, ce qui permet d'accélérer les temps de chargement.
  • Exécution indépendante :
    Comme les scripts sont exécutés indépendamment les uns des autres, le chargement d'une ressource ne peut pas bloquer les autres, ce qui se traduit par une expérience de chargement plus fluide et plus efficace.
  • Optimisation pour les sites de contenu :
    Les sites Web qui dépendent fortement de ressources externes peuvent utiliser async pour améliorer leur temps de chargement et l'expérience utilisateur.

Y a-t-il des défis à relever lors de l'utilisation d'async ?

  • Ordre d'exécution imprévisible :
    Comme les scripts asynchrones sont exécutés dans l'ordre dans lequel ils sont chargés, cela peut poser des problèmes lorsque l'ordre des scripts est important. Cela peut conduire à des erreurs, en particulier si un script dépend d'un autre.
  • Compatibilité avec les anciens navigateurs :
    Bien qu'async soit pris en charge par la plupart des navigateurs modernes, il peut y avoir des problèmes dans les anciens navigateurs.

Comment utiliser async dans la pratique ?

Un exemple typique d'utilisation de l'attribut async se présente comme suit :

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Page d'exemple</title>
  6. <script src="script1.js" async></script>
  7. <script src="script2.js" async></script>
  8. </head>
  9. <body>
  10. <h1>Bienvenue sur mon site</h1>
  11. <p>Voici un exemple de site.
  12. </p></body></html>

Dans cet exemple, les scripts script1.js et script2.js sont chargés et exécutés de manière asynchrone, quel que soit l'ordre dans lequel ils apparaissent dans le document ou le moment où ils sont complètement chargés.

Remarque sur l'utilisation de CCM19

Le script CCM19 ne doit pas être doté de l'attribut async, car cela pourrait nuire au bon fonctionnement du gestionnaire de consentement. Le CCM19 doit s'assurer que tous les consentements nécessaires sont obtenus avant le chargement d'autres scripts. Il doit donc être exécuté suffisamment tôt et dans le bon ordre afin de mettre en œuvre correctement les règles de protection des données.