Sequential vs parallel async execution in Node.js - Performance Comparison

Performance: Sequential vs parallel async execution

HIGH IMPACT

This concept affects how fast asynchronous tasks complete and how responsive the application feels during execution.

Fetching multiple data sources asynchronously

Node.js

async function fetchParallel() {
  const promise1 = fetchData1();
  const promise2 = fetchData2();
  const promise3 = fetchData3();
  const results = await Promise.all([promise1, promise2, promise3]);
  return results;
}

Starts all fetches at once, allowing them to run concurrently and reducing total wait time to the longest single fetch.

📈 Performance GainReduces total wait time to max single fetch duration, improving responsiveness and freeing event loop sooner.

Fetching multiple data sources asynchronously

Node.js

async function fetchSequential() {
  const data1 = await fetchData1();
  const data2 = await fetchData2();
  const data3 = await fetchData3();
  return [data1, data2, data3];
}

Each fetch waits for the previous one to finish, causing longer total wait time and blocking user interactions.

📉 Performance CostBlocks event loop sequentially, increasing total wait time by sum of all fetch durations.

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
Sequential async	Minimal DOM ops until all data fetched	1 reflow after all data ready	Single paint after data update	[X] Bad
Parallel async	Minimal DOM ops, data ready sooner	1 reflow after longest fetch completes	Single paint after data update	[OK] Good

Rendering Pipeline

Async execution affects the event loop and rendering by controlling when data is ready to update the UI. Sequential waits block the event loop longer, delaying rendering updates. Parallel execution frees the event loop sooner, allowing faster UI updates.

→JavaScript Execution

→Event Loop

→Rendering

⚠️ BottleneckEvent Loop blocking during sequential awaits

Core Web Vital Affected

INP

This concept affects how fast asynchronous tasks complete and how responsive the application feels during execution.

Optimization Tips

1Avoid awaiting async tasks one after another if they can run independently.

2Use Promise.all to run multiple async tasks in parallel for faster completion.

3Parallel async execution reduces event loop blocking and improves user input responsiveness.

Performance Quiz - 3 Questions

What is the main performance benefit of running async tasks in parallel instead of sequentially?

A Uses less memory overall

B Reduces total wait time by running tasks concurrently

C Simplifies error handling

D Improves CSS rendering speed

DevTools: Performance

How to check: Record a performance profile while running sequential and parallel async code. Look at the Main thread activity and event loop idle times.

What to look for: Long blocking periods in sequential code vs shorter blocking and more idle time in parallel code indicate better responsiveness.

Practice

1. What is the main difference between sequential and parallel async execution in Node.js?

easy

A. Sequential async is faster than parallel async in all cases.

B. Sequential async waits for each task to finish before starting the next, while parallel async runs tasks at the same time.

C. Sequential async uses callbacks, while parallel async uses promises.

D. Sequential async runs all tasks at once, while parallel async runs them one by one.

Solution

1. Step 1: Understand sequential async execution

   Sequential async means tasks run one after another, waiting for each to complete before starting the next.

2. Step 2: Understand parallel async execution

   Parallel async means tasks run at the same time, without waiting for others to finish first.

3. Final Answer:

   Sequential async waits for each task to finish before starting the next, while parallel async runs tasks at the same time. -> Option B

4. Quick Check:

   Sequential vs parallel async = D [OK]

Hint: Sequential waits, parallel runs together [OK]

Common Mistakes:

• Confusing which runs tasks one by one
• Thinking parallel always uses callbacks
• Assuming sequential is always faster

2. Which of the following is the correct syntax to run two async functions task1() and task2() in parallel using Promise.all?

easy

A. await Promise.all([task1(), task2()]);

B. Promise.all(task1(), task2());

C. await task1(); await task2();

D. task1().then(task2());

Solution

1. Step 1: Recall Promise.all syntax

   Promise.all takes an array of promises and waits for all to complete in parallel.

2. Step 2: Check correct usage

   The correct syntax is await Promise.all([task1(), task2()]) to run both tasks in parallel and wait for both.

3. Final Answer:

   await Promise.all([task1(), task2()]); -> Option A

4. Quick Check:

   Promise.all needs array of promises [OK]

Hint: Use Promise.all with array for parallel [OK]

Common Mistakes:

• Missing array brackets in Promise.all
• Awaiting tasks one by one (sequential)
• Calling then() incorrectly without chaining

3. Consider this code snippet:

async function run() {
  const result1 = await task1();
  const result2 = await task2();
  return [result1, result2];
}
run().then(console.log);

What will be the order of execution and output behavior?

medium

A. task1 and task2 run in parallel; output is an array of both results.

B. Both tasks run sequentially but output is only result2.

C. task2 runs first, then task1; output is an array with reversed results.

D. task1 runs first, then task2 starts after task1 finishes; output is an array of both results.

Solution

1. Step 1: Analyze await usage

   Each await pauses execution until the promise resolves, so task1 finishes before task2 starts.

2. Step 2: Understand output array

   Both results are collected in order into an array and returned, so output is [result1, result2].

3. Final Answer:

   task1 runs first, then task2 starts after task1 finishes; output is an array of both results. -> Option D

4. Quick Check:

   Sequential await = B [OK]

Hint: Await pauses; tasks run one after another [OK]

Common Mistakes:

• Assuming tasks run in parallel with sequential await
• Thinking output order is reversed
• Believing output contains only one result

4. Identify the error in this code snippet intended to run two async tasks in parallel:

async function run() {
  const results = await Promise.all(task1(), task2());
  console.log(results);
}

medium

A. Promise.all requires an array of promises, but here arguments are passed separately.

B. Await cannot be used with Promise.all.

C. task1 and task2 must be awaited separately before Promise.all.

D. console.log cannot print arrays.

Solution

1. Step 1: Check Promise.all argument

   Promise.all expects a single array of promises, but here two arguments are passed separately.

2. Step 2: Correct usage

   It should be Promise.all([task1(), task2()]) with square brackets to group promises.

3. Final Answer:

   Promise.all requires an array of promises, but here arguments are passed separately. -> Option A

4. Quick Check:

   Promise.all needs array argument [OK]

Hint: Promise.all needs array, not separate args [OK]

Common Mistakes:

• Passing promises as separate arguments
• Thinking await can't be used with Promise.all
• Misunderstanding console.log capabilities

5. You have three independent async tasks: taskA(), taskB(), and taskC(). You want to run taskA and taskB in parallel, then run taskC only after both finish. Which code correctly implements this?

hard

A. const c = await taskC();
const [a, b] = await Promise.all([taskA(), taskB()]);

B. await taskA(); await taskB(); await taskC();

C. const [a, b] = await Promise.all([taskA(), taskB()]);
const c = await taskC();

D. Promise.all([taskA(), taskB(), taskC()]);

Solution

1. Step 1: Run taskA and taskB in parallel

   Using await Promise.all([taskA(), taskB()]) runs both tasks at the same time and waits for both to finish.

2. Step 2: Run taskC after both finish

   After awaiting both, await taskC() runs taskC sequentially, ensuring it starts only after taskA and taskB complete.

3. Final Answer:

   const [a, b] = await Promise.all([taskA(), taskB()]); const c = await taskC(); -> Option C

4. Quick Check:

   Parallel first, then sequential = A [OK]

Hint: Use Promise.all for parallel, then await next task [OK]

Common Mistakes:

• Running all tasks in parallel ignoring order
• Running tasks sequentially without parallelism
• Starting taskC before taskA and taskB finish