¿En qué consiste la diferencia en el funcionamiento de los modos (async, defer o type) de la etiqueta <script>?

<script> sin atributos

• El HTML se analiza hasta la etiqueta <script>.
• La análisis del HTML se pausa al detectar la etiqueta <script>.
• Se carga el script.
• Se ejecuta el script.
• La análisis del HTML se reanuda después de la ejecución del script.

<script async>

• El HTML se analiza simultáneamente con la carga del script.
• La análisis del HTML se pausa al completar la carga del script.
• Se ejecuta el script.
• La análisis del HTML se reanuda después de la ejecución del script.
• El orden de ejecución de scripts con async no está garantizado, depende de la velocidad de carga.

<script defer>

• El HTML se analiza simultáneamente con la carga del script.
• El script se ejecuta después de completar el análisis del HTML, pero antes del evento DOMContentLoaded.
• El orden de ejecución de scripts con defer está garantizado, corresponde al orden en que aparecen en el HTML.
• Comportamiento similar a <script> colocado antes de la etiqueta de cierre </body>.

<script type="module"> (para módulos ECMAScript)

• Se trata como <script defer> por defecto (ejecución diferida después del análisis, mantiene el orden).
• Puede usarse con el atributo async.
• Soporta importación/exportación de módulos. Crea un ámbito (scope) separado.

Atributo	Carga del script	Ejecución del script	Bloqueo del análisis HTML	Orden de ejecución
Ninguno	Bloqueante	Bloqueante	Sí	Se mantiene
async	No bloqueante (paralela)	No bloqueante (al completar la carga)	No	No garantizado
defer	No bloqueante (paralela)	No bloqueante (después del análisis HTML)	No	Se mantiene
type="module"	No bloqueante (paralela)	No bloqueante (después del análisis HTML, por defecto)	No	Se mantiene (por defecto)

// Ejemplo de script simple
console.log('Script normal');

// Ejemplo de script asíncrono
console.log('Script asíncrono');

// Ejemplo de script diferido
console.log('Script diferido');

// Ejemplo de módulo
import { someFunction } from './module.js';
someFunction();
console.log('Script módulo');