Tengo una aplicación web que carga varios ficheros de JavaScript de la siguiente manera (simplificada, en realidad tengo 8-10 ficheros):
<script src="codigo1.js"></script>
<script src="codigo2.js"></script>
<script src="codigo3.js"></script>
<script src="codigo4.js"></script>
Algunos de esos ficheros son muy grandes y tardan en cargarse, así que estaba pensando en usar defer
o async
para que no afectaran a la carga de la página en general. Pero me encuentro con un problema: algunos de esos ficheros son dependientes de la carga de los otros.
Por ejemplo, codigo4.js utiliza información que se carga en codigo1.js y codigo2.js. Pero codigo1.js es un archivo bastante más grande que codigo4.js, por lo que si cargo los scripts de manera asíncrona podría darse el caso de que codigo4.js se ejecutase antes que codigo1.js.
¿Hay alguna manera de usar defer
o async
pero manteniendo el orden de ejecución indicado en el código? ¿Qué alternativas tengo?