Które przeglądarki obsługują <skrypt async = „async” />?

196

1 grudnia 2009 r. Google ogłosiło obsługę asynchronicznego śledzenia Google Analytics .

Śledzenie asynchroniczne uzyskuje się za pomocą dyrektywy asynchronicznej dla <script>znacznika.

Które przeglądarki obsługują dyrektywę asynchroniczną ( <script async="async" />) i od której wersji?

javascript html performance asynchronous google-analytics knorv
źródło
1
Znajduje się na stronie, do której linkujesz: „Firefox 3.6 jest pierwszą przeglądarką, która oficjalnie oferuje wsparcie dla tej nowej funkcji” FWIW to funkcja HTML5, która szybko zyskuje coraz lepsze wsparcie.
Crescent Fresh
51
Specyfikacja HTML5 mówi, że async = „true” jest nielegalny. Jako boolean atrybut HTML obecność atrybutu wskazuje „prawda”, podczas gdy brak atrybutu oznacza „fałsz”. Jeśli atrybut jest obecny, jedynymi poprawnymi wartościami dla atrybutu są „” i „asynchronizacja”.
Joel Mueller,
Oto test na żywo tego atrybutu html5demo.braincracking.org/demo/async.php .
3
Powinna to być zakładka do częstego sprawdzania dla wszystkich zainteresowanych tym problemem: en.wikipedia.org/wiki/Comparison_of_layout_engines_%28HTML5%29
pumpkinthehead

Odpowiedzi:

162

Wsparcie asynchroniczne określone przez Google jest uzyskiwane z dwóch części:

  • używając skryptu na swojej stronie (skrypt jest dostarczany przez google), aby napisać znacznik <script> w DOM.

  • ten skrypt ma atrybut async = "true", który sygnalizuje kompatybilnym przeglądarkom, że może kontynuować renderowanie strony.

Pierwsza część działa w przeglądarkach bez obsługi <script async.. tagów, pozwalając im ładować asynchronicznie „hack” (choć całkiem solidny), a także umożliwia renderowanie strony bez oczekiwania na pobranie ga.js.

Druga część dotyczy tylko zgodnych przeglądarek, które rozumieją atrybut asynchroniczny HTML

  • FF 3.6+
  • FF na Androida Wszystkie wersje
  • IE 10+ (od wersji zapoznawczej 2)
  • Chrome 8+
  • Chrome na Androida Wszystkie wersje
  • Safari 5.0+
  • iOS Safari 5.0+
  • Android Browser 3.0+ (plaster miodu na górze)
  • Opera 15.0+
  • Opera Mobile 16.0+
  • Opera Mini Brak (od 8.0)

„Właściwym html5” sposobem określenia asynchronizacji jest użycie znaku „ <script async src="..."nie” <script async="true". Jednak początkowo przeglądarki nie obsługiwały tej składni ani nie obsługiwały ustawiania właściwości skryptu na elementy, do których istnieją odniesienia. Jeśli chcesz, lista się zmienia:

  • FF 4+
  • IE 10+ (wersja zapoznawcza 2 i nowsze)
  • Chrome 12+
  • Chrome na Androida 32+
  • Safari 5.1+
  • Brak wersji Androida
Philip Rieck
źródło
34
Nie jestem pewien, czy potrzebujesz nawet async = "true", możesz po prostu napisać „async”
vsync
4
więc jeśli wygeneruję tag skryptu, tak jak robi to Google - co byłoby poprawne: var s = document.createElement ('script'); s.async = 'true'; s.async = true; (Google robi to w ten sposób) lub s.async = 'async'; ?
Toby
8
@Tobie: przenikasz atrybuty boolowskie HTML i odpowiadające im właściwości elementu DOM: atrybut HTML (obecny w znacznikach i gdy jawnie ustawiasz atrybuty za pomocą setAttribute, co nie jest zalecane) powinien być po prostu obecny lub ustawiony na pusty ciąg lub sam ( defer="defer"szczególnie ważne przy pisaniu dokumentów zgodnych z XHTML); ustawiając właściwość elementu w locie za pomocą JavaScript, należy użyć s.async = true.
Marcel Korpel
39
@vsync: To nawet nie powinno być true; albo async, async=""albo async="async".
Marcel Korpel,
4
Pamiętaj, że post połączony w zestawach pytań async="true". To nie jest właściwy sposób to zrobić teraz , ale to był jedyny szeroko wspierany sposób to zrobić potem . Na przykład IE10p2 obsługiwany, async="true"ale nie obsługiwanyasync="async"
Philip Rieck
60

To pytanie składa się z dwóch części.

  1. P: Które przeglądarki obsługują atrybut „asynchroniczny” w znaczniku skryptu w znacznikach?

    Odp .: IE10p2 +, Chrome 11+, Safari 5+, Firefox 3.6+

  2. Q: Jakie przeglądarki obsługują nową specyfikację, która definiuje zachowanie za „asynchroniczny” właściwości w JavaScript na dynamicznie utworzony elementu skryptu?

    Odp .: IE10p2 +, Chrome 12+, Safari 5.1+, Firefox 4+

Jeśli chodzi o Operę, są bardzo blisko wydania wersji, która będzie obsługiwać oba typy asynchronizacji. Pracowałem z nimi ściśle nad tym i wkrótce powinno się to wydać (mam nadzieję!).

Więcej informacji na temat uporządkowanego-async (aka, „async = false”) można znaleźć tutaj: http://wiki.whatwg.org/wiki/Dynamic_Script_Execution_Order

Ponadto, aby sprawdzić, czy przeglądarka obsługuje nowe zachowanie właściwości dynamicznej asynchronizacji: http://test.getify.com/test-async/

Kyle Simpson
źródło
25

Pełna lista wersji przeglądarki obsługujących ten asyncparametr jest dostępna tutaj

JeremiahLee
źródło
10

Z Twojej strony:

http://googlecode.blogspot.com/2009/12/google-analytics-launches-asynchronous.html

Firefox 3.6 jest pierwszą przeglądarką, która oficjalnie oferuje obsługę tej nowej funkcji. Jeśli jesteś ciekawy, oto więcej szczegółów na temat oficjalnej specyfikacji asynchronicznej HTML5 .

tvanfosson
źródło
„ta nowa funkcja” odnosi się do atrybutu asynchronicznego HTML5. Fragment asynchroniczny Google Analytics jest obsługiwany przez wszystkie przeglądarki.
Brian
1

asyncJest obecnie obsługiwana przez wszystkie najnowsze wersje głównych przeglądarek. Jest obsługiwany od kilku lat w większości przeglądarek.

Tutaj możesz śledzić, które przeglądarki obsługują asynchronizację (i odraczanie) na stronie MDN:
https://developer.mozilla.org/en-US/docs/HTML/Element/script

brunoais
źródło
Chociaż ten link może odpowiedzieć na pytanie, lepiej jest dołączyć tutaj istotne części odpowiedzi i podać link w celach informacyjnych. Odpowiedzi zawierające tylko łącze mogą stać się nieprawidłowe, jeśli połączona strona ulegnie zmianie. - Z przeglądu
Michael Gaskill,
@MichaelGaskill Czy to wystarczy? Czy chcesz, żebym odniósł się do odpowiedzi Filipa?
brunoais
0

Właśnie obejrzałem DOM (document.scripts [1] .attributes) tej strony, która korzysta z Google Analytics. Mogę powiedzieć, że Google używa async = "".

[type="text/javascript", async="", src="http://www.google-analytics.com/ga.js"]
jeekajoo
źródło