Доброго времени суток, я новичок в js, поэтому не судите строго, за возможно глупый вопрос, но зачем используют async и defer? Если можно, был бы благодарен примерам, понимаю что это касается загрузки скриптов на страницу, но более глубоко не могу понять, заранее благодарю!
Эти атрибуты используют для регулирования порядка загрузки javascript скриптов (внешних, те которые подключены с помощью атрибута src), то есть с помощью них мы можем указать порядок загрузки скриптов, или что порядка не должно быть, или что скрипты должны быть выполнены сразу по загрузке, в общем лучше показать и объяснить на нескольких примерчиках:
<script src="first.js" async>
<script src="second.js" async>
Это собственно атрибут async, с его помощью, мы говорим что следует выполнять скрипт асинхронно и не следует ждать загрузки страницы, то есть как только скрипт будет загружен он выполнится, например, вполне может быть что второй скрипт загрузится первее и он не будет ждать первый скрипт и просто выполнится по окончанию загрузки, то есть загрузка скриптов идет сразу же и загружаются одновременно, а выполняются сразу по окончании загрузки, а вот пример атрибута defer:
<script src="first.js" defer>
<script src="second.js" defer>
Атрибут defer отличается от async только тем что он строго сохраняет порядок, то есть если в верхнем примере у нас второй скрипт загрузился бы быстрее то он сразу бы выполнился, тут же порядок строго соблюдается, даже если второй скрипт загрузится первее, он будет ждать первый скрипт, и пока он не выполнится, сам выполнятся не будет, ну и еще одна деталь что defer ждет полной готовности страницы, вот пример:
<script src="async.js" async>
<script src="defer.js" defer>
То есть до тех пор пока страницы не будет готова, второй скрипт не выполнится, а первый скрипт вполне может, по мере своей загрузки.