How can I avoid awaiting independent work one request at a time?

Call both operations first, then await their promises together with Promise.all. For example, if loadProfile() and loadMessages() are independent:

const profilePromise = loadProfile();
const messagesPromise = loadMessages();

const [profile, messages] = await Promise.all([
  profilePromise,
  messagesPromise
]);

The operations are started when their functions are called; Promise.all waits for the promises you give it. Its results are arranged to match the input order, so profile corresponds to the first promise and messages to the second. [S1]

By contrast, this waits for the first result before calling the second function:

const profile = await loadProfile();
const messages = await loadMessages();

That sequence is appropriate if the second operation needs the first result, or if you deliberately want to start it later. The key distinction is dependency, not simply how many await keywords appear.

Assuming both functions return promises and loadMessages() does not need the profile, these versions express different scheduling:

// Sequential: call the second function after the first settles
const profile = await loadProfile();
const messages = await loadMessages();

// Concurrent: call both before waiting for their results
const [profile, messages] = await Promise.all([
  loadProfile(),
  loadMessages()
]);

In the second version, JavaScript calls each function to obtain its promise, then Promise.all waits for the promises together. [S1] The values are still available for use in the same way. Keep the order in the array matched to the names on the left: swapping the array entries swaps which result is assigned to each variable.

This lets independent work proceed at the same time; it does not mean either operation itself becomes faster. The relevant guidance does not establish how long a particular operation will take, whether it will succeed, or whether a particular service or function is safe to run alongside another.

That is a real dependency, so keep those steps sequential. First obtain the ID, then pass it to the details operation:

const account = await loadAccount();
const details = await loadDetails(account.id);

The second operation cannot be correctly called until you have the ID it needs. The decision rule is: if you cannot correctly call the second operation until you have the first result, await the first before starting the second. If both operations can be called with information already available, start them and await their promises together. [S1]

For each await, ask what information is required to start the next operation. If the required inputs are already available, and the operations are intended to proceed independently, collect their promises and use Promise.all. If an input comes from an earlier result, keep that dependency sequential.

For example, suppose a page needs a list of projects and the current user’s preferences, and neither request needs the other’s result. Treat that as independent work:

const [projects, preferences] = await Promise.all([
  loadProjects(),
  loadPreferences()
]);

If loading a project’s tasks requires a project ID returned by loadProject, preserve the order:

const project = await loadProject();
const tasks = await loadTasks(project.id);

One other behavior matters: Promise.all rejects if an input promise rejects. [S1] Decide how your surrounding code should handle that failure rather than assuming both operations will always succeed.