Différence entre 'async' et 'defer' dans JS !
Apr 22 2023
Async et defer sont les attributs (facultatifs) de la balise <script> traditionnelle en HTML. Effacer les bases! Remarque : ne doit pas utiliser à la fois 'async' et 'defer' sur le même script car cela peut provoquer un comportement indésirable entre les navigateurs.
Async et defer sont les attributs (facultatifs) de la balise <script> traditionnelle en HTML.
<head>
<!-- other head things -->
<script async src="">
<script defer src="">
<head/>
Effacer les bases!
- La balise de script en HTML est utilisée pour intégrer un fichier JavaScript externe. Il peut même contenir des instructions de script s'il ne pointe pas vers un fichier js.
- Généralement utilisé juste avant la fin de la balise body. Peut également être placé à l'intérieur de la tête. Le placement en tête ou devant l'extrémité du corps remplit différentes fonctions.
- Lors du chargement d'une page Web, deux événements majeurs se produisent dans le navigateur : l'analyse HTML et le chargement des scripts.
- Le chargement des scripts comprend le téléchargement du script depuis le serveur et la partie exécution.
- Téléchargez les fichiers de script en arrière-plan pendant l'analyse HTML.
- Après le téléchargement, il met en pause l'analyse HTML et exécute le script. Une fois l'exécution terminée, l'analyse des restes a lieu.
- Les fichiers de script sont exécutés sans ordre.
- Élimine l'effet de blocage de rendu de JS lors du téléchargement (n'arrête pas / ne met pas en pause l'analyse HTML).
- Téléchargez les fichiers de script en arrière-plan pendant l'analyse HTML.
- N'interrompt pas l'analyse HTML même après le téléchargement et est exécuté une fois l'analyse HTML terminée.
- Les fichiers de script sont exécutés dans l'ordre.
- Élimine l'effet de blocage de rendu de JS lors du téléchargement (n'arrête pas / ne met pas en pause l'analyse HTML).
- Semblable à la balise de script conventionnelle dans le corps, mais l'utilisation de defer lui permet de passer à la tête, ce qui entraîne un chargement précoce des scripts ultérieurs.
Remarque : ne doit pas utiliser à la fois 'async' et 'defer' sur le même script car cela peut provoquer un comportement indésirable entre les navigateurs.
Quoi utiliser quand ?
Asynchrone :
- Mieux pour les ressources hautement prioritaires qui improvisent le chargement précoce de la page car l'exécution se fait juste après le téléchargement des scripts.
- Doit être utilisé pour les fichiers indépendants importants qui ne sont pas liés à d'autres scripts et aider au chargement précoce.
- Peut être utilisé pour les ressources qui ne sont pas importantes et sont destinées à une utilisation ultérieure. En effet, l'exécution des scripts différés a lieu en dernier après l'analyse complète du code HTML.
Connectez-vous avec moi sur : LinkedIn , GitHub
![Qu'est-ce qu'une liste liée, de toute façon? [Partie 1]](https://post.nghiatu.com/assets/images/m/max/724/1*Xokk6XOjWyIGCBujkJsCzQ.jpeg)
