How to check if an Javascript script has been loaded Asynchronously (Async) or async attribute is present?

Question

I would like know if there exists a handy way to check if an script (on execution) has been loaded asynchronously.

E.g. the script tag:

<script async type="text/javascript" src="js/async.js"></script>

the script async.js:

if (_condition_to_check_if_this_has_been_loaded_async) { console.log("async: true") }

Answer 1

Unless you want IE compatibility, the correct answer to this problem is using the little-known but widely supported document.currentScript property.

This property returns the HTMLScriptElement of the script currently being executed (or nothing if the script isn't in a tag/is a callback or similar), which tells you if it has the async/defer attributes, among other things.

The MDN example even cites this exact use-case:

if (document.currentScript.async) {
  console.log("Executing asynchronously");
} else {
  console.log("Executing synchronously");
}