Некоторые основные отличия между асинхронной и отложенной загрузкой скриптов:
- Приоритет загрузки. 5 Асинхронные скрипты имеют низкий приоритет и не блокируют загрузку других ресурсов. 5 Отложенные скрипты имеют средний приоритет и не блокируют загрузку других ресурсов, но гарантируют свою загрузку до события DOMContentLoaded. 5
- Порядок выполнения. 25 Асинхронные скрипты выполняются сразу после загрузки, без учёта порядка появления на странице или завершения разбора HTML. 5 Отложенные скрипты сохраняют порядок своего появления на странице и выполняются перед событием DOMContentLoaded. 5
- Блокирование страницы. 2 Асинхронная загрузка блокирует синтаксический анализ страницы, отложенная никогда не блокирует. 2
Атрибут async используется для скриптов, которые не требуют немедленного выполнения, не влияют на отображение страницы и не зависят от других скриптов. 5 Атрибут defer подходит для скриптов, которые работают с элементами DOM, добавляют обработчики событий или инициализируют некоторую функциональность. 5