How to use top-level await in JavaScript

Learn how to use this new feature currently available in v8

Usually can use await only inside async functions. So it’s common to declare an immediately invoked async function expression to wrap it:

(async () => {
  await fetch(/* ... */)
})()

or also declare a function and then call it:

const doSomething = async () => {
  await fetch(/* ... */)
}

doSomething()

Top-level await will allow us to simply run

await fetch(/* ... */)

without all this boilerplate code.

With a caveat: this only works in ES modules.

For a single JavaScript file, without a bundler, you can save it with the .mjs extension and you can use top-level await.