Error handling in async/await in Node.js - Performance & Optimization

Performance: Error handling in async/await

MEDIUM IMPACT

This affects interaction responsiveness and error recovery speed during asynchronous operations in Node.js applications.

Handling errors in asynchronous functions using async/await

Node.js

async function fetchData() {
  try {
    const data = await fetch('https://api.example.com/data');
    const json = await data.json();
    return json;
  } catch (error) {
    console.error('Fetch failed:', error);
    throw error; // rethrow or handle gracefully
  }
}

fetchData().then(console.log).catch(console.error);

Catches errors immediately, allowing graceful recovery or logging, preventing unhandled rejections and improving responsiveness.

📈 Performance GainAvoids unhandled promise rejections; reduces error propagation delay; improves INP by handling errors promptly.

Handling errors in asynchronous functions using async/await

Node.js

async function fetchData() {
  const data = await fetch('https://api.example.com/data');
  const json = await data.json();
  return json;
}

fetchData().then(console.log).catch(console.error);

Errors inside fetchData are not caught within the function, causing unhandled promise rejections if caller forgets to handle errors.

📉 Performance CostBlocks interaction until error bubbles up; may cause unhandled rejections leading to process warnings or crashes.

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
No internal try/catch in async function	N/A	N/A	N/A	[X] Bad
Using try/catch inside async function	N/A	N/A	N/A	[OK] Good

Rendering Pipeline

Async/await error handling affects the JavaScript execution and event loop stages, influencing how quickly errors are caught and handled without blocking UI updates.

→JavaScript Execution

→Event Loop

→Task Queue

⚠️ BottleneckDelayed error catching causes longer blocking of the event loop, reducing responsiveness.

Core Web Vital Affected

INP

This affects interaction responsiveness and error recovery speed during asynchronous operations in Node.js applications.

Optimization Tips

1Always use try/catch inside async functions to handle errors promptly.

2Avoid relying solely on .catch() outside async functions to prevent delayed error handling.

3Handle errors early to keep the event loop unblocked and maintain good interaction responsiveness.

Performance Quiz - 3 Questions

What is the main performance benefit of using try/catch inside async functions?

A It catches errors immediately, preventing blocking of the event loop.

B It reduces the size of the JavaScript bundle.

C It improves CSS rendering speed.

D It eliminates the need for promises.

DevTools: Performance

How to check: Record a session while triggering async operations with and without error handling. Look for long tasks or blocked event loop periods.

What to look for: Check for long frames or delayed task completions indicating blocking due to unhandled errors.

Practice

1. What is the main purpose of using try/catch blocks with async/await in Node.js?

easy

A. To catch and handle errors from asynchronous operations

B. To speed up the execution of async functions

C. To convert async functions into synchronous ones

D. To automatically retry failed async operations

Solution

1. Step 1: Understand async/await behavior

   Async functions return promises and can throw errors when awaited operations fail.

2. Step 2: Role of try/catch

   Try/catch blocks catch these errors to prevent crashes and allow handling.

3. Final Answer:

   To catch and handle errors from asynchronous operations -> Option A

4. Quick Check:

   Error handling = A [OK]

Hint: Use try/catch around await to catch errors [OK]

Common Mistakes:

• Thinking async/await automatically handles errors
• Using try/catch outside async functions only
• Ignoring errors causing app crashes

2. Which of the following is the correct syntax to handle errors in an async function using async/await?

easy

A. async function fetchData() { try { await fetch(url); } catch (err) { console.error(err); } }

B. async function fetchData() { await fetch(url); }

C. async function fetchData() { try { fetch(url); } catch (err) { console.error(err); } }

D. async function fetchData() { await fetch(url).catch(console.error); }

Solution

1. Step 1: Check proper use of try/catch with await

   async function fetchData() { try { await fetch(url); } catch (err) { console.error(err); } } correctly wraps the await call inside try and catches errors.

2. Step 2: Identify incorrect patterns

   async function fetchData() { await fetch(url).catch(console.error); } uses .catch on await which is invalid syntax; async function fetchData() { try { fetch(url); } catch (err) { console.error(err); } } misses await; async function fetchData() { await fetch(url); } has no error handling.

3. Final Answer:

   async function fetchData() { try { await fetch(url); } catch (err) { console.error(err); } } -> Option A

4. Quick Check:

   Try/catch with await = D [OK]

Hint: Put await inside try block to catch errors [OK]

Common Mistakes:

• Using .catch() directly on await expression
• Forgetting to use await inside try
• Not catching errors at all

3. Consider this code snippet:

async function getData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    return data;
  } catch (error) {
    return 'Error occurred';
  }
}

getData().then(console.log);

What will be logged if the fetch fails due to network error?

medium

A. An unhandled promise rejection error

B. The raw error object

C. Undefined

D. 'Error occurred'

Solution

1. Step 1: Analyze try/catch behavior on fetch failure

   If fetch fails, control jumps to catch block which returns 'Error occurred'.

2. Step 2: Understand promise resolution

   getData returns a resolved promise with string 'Error occurred', so console.log prints that string.

3. Final Answer:

   'Error occurred' -> Option D

4. Quick Check:

   Catch returns string on error = B [OK]

Hint: Catch block return value is logged on error [OK]

Common Mistakes:

• Expecting unhandled error instead of caught return
• Confusing error object with returned string
• Ignoring async function returns promise

4. Identify the error in this async function:

async function loadUser() {
  try {
    const user = fetch('https://api.example.com/user');
    console.log(user.name);
  } catch (err) {
    console.error(err);
  }
}

medium

A. Incorrect catch block syntax

B. Missing await before fetch causing user to be a Promise

C. console.log should be inside catch block

D. fetch URL is invalid

Solution

1. Step 1: Check fetch usage

   fetch returns a Promise; without await, user is a Promise object, not the resolved data.

2. Step 2: Consequence of missing await

   Accessing user.name fails because user is not the actual data but a Promise.

3. Final Answer:

   Missing await before fetch causing user to be a Promise -> Option B

4. Quick Check:

   Await missing = A [OK]

Hint: Always await fetch to get resolved data before use [OK]

Common Mistakes:

• Forgetting await before async calls
• Assuming fetch returns data directly
• Misplacing console.log outside async flow

5. You want to fetch user data and then fetch posts by that user. Both calls can fail. How should you handle errors to ensure you catch failures in either step and log a clear message?

async function getUserPosts(userId) {
  // Your code here
}

hard

A. Use nested try/catch blocks: one for user fetch, one for posts fetch

B. Use .then().catch() chaining instead of async/await

C. Use a single try/catch wrapping both awaits for user and posts fetch

D. Ignore errors and let them crash the app

Solution

1. Step 1: Understand error flow in async/await

   A single try/catch can catch errors from any awaited call inside it.

2. Step 2: Simplify error handling

   Wrapping both awaits in one try/catch logs errors clearly without nesting complexity.

3. Final Answer:

   Use a single try/catch wrapping both awaits for user and posts fetch -> Option C

4. Quick Check:

   One try/catch covers multiple awaits = C [OK]

Hint: Wrap all awaits in one try/catch for simple error handling [OK]

Common Mistakes:

• Overcomplicating with nested try/catch
• Using .then().catch() mixing styles
• Not handling errors causing silent failures