Атрибут async тега <script>

Описание

Атрибут async указывает браузеру, что скрипт должен выполняться асинхронно, как только он будет загружен, без блокировки парсинга HTML. Это особенно полезно для сторонних скриптов, которые не зависят от других скриптов на странице.

Пример использования:
<script async src="analytics.js"></script>

Особенности работы:

Характеристика Описание
Порядок выполнения Скрипт выполняется сразу после загрузки, порядок не гарантируется
Блокировка рендеринга Не блокирует парсинг HTML
DOMContentLoaded Может выполниться до или после этого события

Сравнение с defer:

<!-- Async - выполнится при первой возможности --> <script async src="script1.js"></script> <!-- Defer - выполнится после парсинга, в порядке объявления --> <script defer src="script2.js"></script>

Рекомендации по использованию:

  • Используйте для независимых сторонних скриптов (аналитика, реклама)
  • Не используйте для скриптов, зависящих от DOM или других скриптов
  • Для критически важных скриптов используйте стандартную загрузку
  • Сочетайте с defer для оптимальной загрузки
Ограничения:
  • Порядок выполнения скриптов не гарантирован
  • Может выполняться до полной загрузки DOM
  • Не поддерживается в IE9 и ниже
Примечание: Атрибут async наиболее полезен для:
  • Скриптов аналитики (Google Analytics)
  • Рекламных скриптов
  • Независимых виджетов
  • Скриптов, которые не модифицируют DOM