I have multiple script tags in my game and the order in which I call them really makes me confused. My game was even crashing at some point. This is how it looks in my code
<script src='https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.4/socket.io.js'></script>
<script src="client/js/generateHTML.js" defer></script>
<script src="client/js/HackTimer.js"></script>
<script src="client/game.js" async></script>
The async
and defer
confuse me.
generateHTML.js script needs to be run only once, and that's when the <body>
is loaded. It just generates bunch of HTML content in the body (upgrade, mastery, crafting boxes etc). After that, it does nothing (the content generated is later used by game.js)
HackTimer.js is a small script I found online which fixes the problem where setIntervals are automatically set to 1000ms if the game tab is out of focus. (ie damage per second actually does 2.5% DPS every 25ms (40FPS) to create a smooth health bar, or 2.5% damage per 1000ms (bad) if the user is browsing another tab). HackTimer fixes this problem.
game.js is where all the functions, objects etc for my game are.
Is my order bad? When, and where should I use defer
and async
, and do I really need to use them?