An inline classic “script” element (i.e., a “script” element without a “src” attribute and with a “type” attribute that is either unspecified, empty, or a JavaScript MIME type) must not have an “async” attribute.

The async attribute is invalid on an inline classic <script>, because there is no external file for the browser to fetch in the background.

async tells the browser to download a script while it keeps parsing the page, and to run it as soon as it arrives. The code of an inline script is already in the page, so the browser runs it right away and async changes nothing. A classic script is any <script> whose type is missing, empty or a JavaScript MIME type such as text/javascript.

Inline module scripts are the exception. On <script type="module">, async makes the module run as soon as it and its imports are ready, instead of waiting until the document has been parsed, so the validator accepts it there.

Templates and performance plugins that add async to every <script> cause most of these. Remove the attribute from the inline script, or move the code to an external file if it should load without blocking the parser.

Invalid example

<script async>
  console.log("Hello");
</script>

Valid example

<script>
  console.log("Hello");
</script>

To load the code without blocking the parser, put it in an external file and keep async on that <script>:

<script src="app.js" async></script>

Learn more:

MDN Reference

MDN Web Docs: The script element

→

MDN Reference

MDN Web Docs: JavaScript modules

→

WHATWG Spec

HTML Standard: Scripting

→