Propriedade async do <script> HTML
Definição e uso
async
A propriedade é uma propriedade booleana.
Se configurado async
A propriedade, o script será baixado paralelamente enquanto a página é analisada e executado imediatamente quando disponível. Assim que o script for completamente baixado, a análise da página será interrompida, em seguida, o script será executado e, em seguida, continuará a análise do resto da página.
Atenção:async
A propriedade é aplicável apenas a scripts externos (e deve ser usada apenas quando a propriedade src existir).
Atenção:Existem várias maneiras de executar scripts externos:
- Se async foi configurado: o script será baixado paralelamente enquanto a página é analisada e executado imediatamente quando disponível (antes de ser analisado completo)
- Se defer foi configurado (mas não async): o script será baixado paralelamente enquanto a página é analisada e executado após a análise da página estar completa
- Se não houver nenhum async nem defer: o script será baixado e executado imediatamente, bloqueando a análise da página até que o script seja executado completo
Exemplo
Os scripts referenciados serão baixados paralelamente enquanto a página é analisada e executados imediatamente quando disponíveis:
<script src="demo_async.js" async></script>
Sintaxe
<script async>
Execução assíncrona de script
O comportamento padrão do navegador ao encontrar elementos script é pausar o processamento da página enquanto carrega e executa o script. Os elementos script são executados em sequência (segundo a ordem definida) de forma sincronizada (não se importa com outras coisas enquanto o script está sendo carregado e executado).
Como método padrão para o processamento de scripts, a execução sequencial sincronizada tem seu significado. No entanto, alguns scripts não precisam ser tratados dessa forma, para esses scripts pode-se usar async
A propriedade melhora seu desempenho. Um exemplo típico é o script de rastreamento (tracking script). Este script pode relatar os registros de visitas do usuário ao site para que as empresas de anúncios possam personalizar e veicular anúncios com base nos hábitos do usuário, ou coletar estatísticas de visitantes do site para análise, entre outros. Esses scripts são autônomos e geralmente não precisam interagir com elementos do documento HTML. Atrasar a exibição da página para esperar pelo carregamento deles e enviar relatórios para seus servidores não tem significado.
Usando async
A propriedade, o navegador carregará e executará o script de forma assíncrona enquanto continua a analisar outros elementos do HTML (inclusive outros elementos script). Se usado corretamente, isso pode melhorar significativamente o desempenho geral de carregamento.
Atenção:Uso async
Uma consequência importante da propriedade é que os scripts na página podem não ser executados na ordem definida. Portanto, se o script usar funções ou valores definidos em outros scripts, não é aconselhável usá-la async
Propriedade.
Suporte do navegador
Os números na tabela indicam a versão do navegador que suportou a propriedade pela primeira vez.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
8.0 | 10.0 | 3.6 | 5.1 | 15.0 |