async/await vs .then() in JavaScript

async/await is syntax built on top of Promises that lets asynchronous code be written and read like synchronous code, using try/catch for error handling instead of chained .then()/.catch() calls.

Common causes

• Long .then() chains for sequential async operations can become hard to read, especially when branching logic is involved
• async/await was introduced specifically to make working with existing Promise-based APIs more readable

How to fix it

• Use async/await for sequential steps that depend on each other's results — it avoids deeply nested .then() callbacks
• Still use Promise.all() (awaited) rather than sequential awaits when multiple independent async calls can run concurrently
• Wrap awaited calls in try/catch to handle rejections, equivalent to a .catch() in the promise-chain style

Example

// .then() style
fetchUser().then(user => fetchPosts(user.id)).then(posts => render(posts))

// async/await style
const user = await fetchUser()
const posts = await fetchPosts(user.id)
render(posts)

FAQ

Is async/await faster than .then()?

No — they compile to the same underlying Promise mechanics. The difference is purely readability and error-handling ergonomics, not performance.