Атрибуты defer и async

Атрибуты defer и async

Обычно браузеры загружают script синхронно, во время разбора документа. Поэтому принято добавлять скрипты в конец документа, перед body, чтобы они не тормозили загрузку страницы. Но при помощи атрибутов defer и async можно явно управлять порядком загрузки и выполнения скриптов.

Атрибут async - Скрипт выполняется полностью асинхронно. Это означает, что файл будет выполняться без ожидания загрузки и отображения веб-страницы. При обнаружении script async src="..." браузер не останавливает обработку страницы, а спокойно работает дальше. Когда скрипт будет загружен  он выполнится.

<script src="script1.js" async></script>

Атрибут defer - Указывает браузеру что скрипт должен выполняться после разбора документа, но до события DOMContentLoaded.

Скрипты с атрибутом defer будут предотвращать запуск события DOMContentLoaded до тех пор, пока скрипт не загрузится полностью и не завершится его инициализация.

 <script src="script1.js" defer></script>
 <script src="script2.js" defer></script>

Share Tweet Send
0 Комментарии
Загрузка...
You've successfully subscribed to Pinta IT 🍺
Great! Next, complete checkout for full access to Pinta IT 🍺
Welcome back! You've successfully signed in
Success! Your account is fully activated, you now have access to all content.