Чем отличаются атрибуты async и defer в HTML?

Атрибуты async и defer в HTML отличаются порядком загрузки и выполнения скриптов. elbrusboot.camp doka.guide

Атрибут async указывает браузеру загружать скрипт асинхронно, то есть параллельно с разбором HTML-документа. elbrusboot.camp Скрипты с этим атрибутом выполняются сразу после загрузки, без учёта порядка появления на странице или завершения разбора HTML. elbrusboot.camp

Атрибут defer указывает браузеру отложить выполнение скрипта до тех пор, пока не будет завершён разбор HTML-документа. elbrusboot.camp Скрипты с этим атрибутом сохраняют порядок своего появления на странице и выполняются перед событием DOMContentLoaded. elbrusboot.camp

Таким образом, async подходит для скриптов, для которых не важен порядок выполнения, а defer — для скриптов, для которых важен порядок выполнения, например, требующих доступа ко всему DOM-дереву. doka.guide

Нельзя использовать оба атрибута в одном файле. elbrusboot.camp Если указать оба атрибута для одного скрипта, то будет применяться только атрибут async. elbrusboot.camp