Quais navegadores suportam <script async = "async" />?


196

Em 1º de dezembro de 2009, o Google anunciou o suporte ao rastreamento assíncrono do Google Analytics .

O rastreamento assíncrono é obtido usando a diretiva async da <script>tag.

Quais navegadores suportam a diretiva assíncrona ( <script async="async" />) e desde qual versão?


1
É exatamente nessa página que você vinculou: "O Firefox 3.6 é o primeiro navegador a oferecer suporte oficial para esse novo recurso" FWIW é um recurso HTML5, que está rapidamente ganhando cada vez mais suporte.
Crescent Fresh

51
A especificação do HTML5 diz que async = "true" é ilegal. Como um atributo HTML booleano, a presença do atributo indica "true", enquanto a ausência do atributo é igual a "false". Se o atributo estiver presente, os únicos valores válidos para o atributo serão "" e "assíncronos".
Joel Mueller

Aqui está um teste ao vivo desse atributo html5demo.braincracking.org/demo/async.php .

3
Este deve ser um marcador para verificar com freqüência para qualquer pessoa interessada nesta questão: en.wikipedia.org/wiki/Comparison_of_layout_engines_%28HTML5%29
pumpkinthehead

Respostas:


162

O suporte assíncrono conforme especificado pelo google é obtido usando duas partes:

  • usando script na sua página (o script é fornecido pelo google) para gravar uma tag <script> no DOM.

  • esse script possui o atributo async = "true" para sinalizar aos navegadores compatíveis que ele pode continuar renderizando a página.

A primeira parte funciona em navegadores sem suporte para <script async..tags, permitindo que eles carreguem de forma assíncrona um "hack" (embora bastante sólido), e também permite renderizar a página sem esperar pela recuperação do ga.js.

A segunda parte afeta apenas navegadores compatíveis que entendem o atributo async html

  • FF 3.6+
  • FF for Android Todas as versões
  • IE 10+ (começando com a visualização 2)
  • Chrome 8 ou superior
  • Chrome For Android Todas as versões
  • Safari 5.0 ou superior
  • iOS Safari 5.0 ou superior
  • Navegador Android 3.0+ (favo de mel ativado)
  • Opera 15.0+
  • Opera Mobile 16.0+
  • Opera Mini Nenhum (a partir de 8.0)

A maneira "html5 apropriada" de especificar assíncrona é com a <script async src="...", não <script async="true". No entanto, inicialmente os navegadores não suportavam essa sintaxe, nem a configuração da propriedade de script nos elementos referenciados. Se você deseja isso, a lista muda:

  • FF 4+
  • IE 10+ (pré-visualização 2 ou superior)
  • Chrome 12 ou superior
  • Chrome para Android 32 ou superior
  • Safari 5.1+
  • Nenhuma versão do Android

34
Não tenho certeza se você precisa de async = "true", basta escrever 'async'
vsync

4
por isso, se eu gerar a tag de script como o google faz - o que seria correto: var s = document.createElement ('script'); s.async = 'verdadeiro'; s.async = verdadeiro; (o Google faz assim) ou s.async = 'async'; ?
Toby

8
@ Tobias: você está misturando atributos booleanos HTML e as propriedades correspondentes do elemento DOM: o atributo HTML (presente na marcação e ao definir explicitamente os atributos usando setAttribute, o que não é recomendado) deve estar presente ou ser definido como uma string vazia ou ela mesma ( defer="defer", especialmente importante ao escrever documentos compatíveis com XHTML); ao definir a propriedade do elemento rapidamente usando JavaScript, deve-se usar s.async = true.
Marcel Korpel

39
@ vsync: nem deveria ser true; quer async, async=""ou async="async".
Marcel Korpel

4
Observe que a postagem vinculada nos conjuntos de perguntas async="true". Não é a maneira correta de fazê-lo agora , mas era a única maneira amplamente apoiada a fazê-lo depois . Por exemplo, IE10p2 suportado, async="true"mas não suportadoasync="async"
Philip Rieck

60

Há duas partes nessa questão, realmente.

  1. P: Quais navegadores oferecem suporte ao atributo "async" em uma marca de script na marcação?

    R: IE10p2 +, Chrome 11+, Safari 5+, Firefox 3.6+

  2. P: Quais navegadores suportam a nova especificação que define o comportamento da propriedade "assíncrona" no JavaScript, em um elemento de script criado dinamicamente?

    R: IE10p2 +, Chrome 12+, Safari 5.1+, Firefox 4+

Quanto ao Opera, eles estão muito perto de lançar uma versão que suportará os dois tipos de assíncrono. Eu tenho trabalhado com eles de perto nisso, e deve sair em breve (espero!).

Pode encontrar mais informações sobre ordenado-assíncrono (aka, "async = falso") aqui: http://wiki.whatwg.org/wiki/Dynamic_Script_Execution_Order

Além disso, para testar se um navegador suporta o novo comportamento de propriedade assíncrona dinâmica: http://test.getify.com/test-async/


25

Uma lista abrangente de versões do navegador que suportam o asyncparâmetro está disponível aqui



1

O asyncé suportado por todas as versões mais recentes dos principais navegadores. Ele é suportado há alguns anos na maioria dos navegadores.

Você pode acompanhar quais navegadores suportam async (e diferem) no site da MDN aqui:
https://developer.mozilla.org/en-US/docs/HTML/Element/script


Embora esse link possa responder à pergunta, é melhor incluir aqui as partes essenciais da resposta e fornecer o link para referência. As respostas somente para links podem se tornar inválidas se a página vinculada for alterada. - Do comentário
Michael Gaskill

@MichaelGaskill Isso é suficiente? Deseja que eu vincule a resposta de Philip?
Brunoais

0

Basta dar uma olhada no DOM (document.scripts [1] .attributes) desta página que usa o Google Analytics. Posso dizer que o Google está usando async = "".

[type="text/javascript", async="", src="http://www.google-analytics.com/ga.js"]
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.