<script> тегинин режимдери (async, defer же type) иштөөдө кандай айырма бар?

<script> атрибутсуз

• HTML <script> тегине чейин талданат.
• HTML талдоо токтотулат <script> тегин аныктоо учурунда.
• Скрипт жүктөлөт.
• Скрипт ишке ашырылат.
• HTML талдоо скрипт ишке ашырылгандан кийин улантылат.

<script async>

• HTML скрипт жүктөө менен бирге талданат.
• Скрипт жүктөлгөндөн кийин HTML талдоо токтотулат.
• Скрипт ишке ашырылат.
• HTML талдоо скрипт ишке ашырылгандан кийин улантылат.
• async менен скрипттердин аткаруу тартиби кепилденбейт, жүктөө ылдамдыгына көз каранды.

<script defer>

• HTML скрипт жүктөө менен бирге талданат.
• Скрипт HTML талдоонун аякташынан кийин, бирок DOMContentLoaded окуясына чейин ишке ашырылат.
• defer менен скрипттердин аткаруу тартиби кепилденет, HTMLдеги жайгашуусуна ылайык.
• жүрүм-турум <script> тегине жакын, ал жабуучу </body> тегинин алдында жайгашкан.

<script type="module"> (ECMAScript модулдары үчүн)

• Ал <script defer> сыяктуу иштейт (кечиктирилген аткаруу, тартипти сактоо).
• async атрибуту менен колдонулушу мүмкүн.
• Модулдарды импорттоо/экспорттоо үчүн колдоого алынган. Өзүнчө көрүү аянтын (scope) түзөт.

Атрибут	Жүктөө	Ишке ашыруу	HTML талдоосун токтотуу	Тартип
Жок	Блокдоочу	Блокдоочу	Ооба	Сакталат
async	Токтотпогуч (параллелдүү)	Токтотпогуч (жүктөөдөн кийин)	Жок	Кепилденбейт
defer	Токтотпогуч (параллелдүү)	Токтотпогуч (HTML талдоодон кийин)	Жок	Сакталат
type="module"	Токтотпогуч (параллелдүү)	Токтотпогуч (HTML талдоодон кийин, алдын ала)	Жок	Сакталат (өз алдынча)

// Жөнөкөй скрипт мисалы
console.log('Жөнөкөй скрипт');

// Асинхрон скрипт мисалы
console.log('Асинхрон скрипт');

// Кечиктирилген скрипт мисалы
console.log('Кечиктирилген скрипт');

// Модул мисалы
import { someFunction } from './module.js';
someFunction();
console.log('Модул скрипт');