Reading files asynchronously with callbacks in Node.js - Performance & Optimization

Performance: Reading files asynchronously with callbacks

MEDIUM IMPACT

This affects how fast the page or server can respond while waiting for file data, impacting input responsiveness and overall user experience.

Reading a file without blocking the main thread

Node.js

const fs = require('fs');
fs.readFile('file.txt', 'utf8', (err, data) => {
  if (err) throw err;
  console.log(data);
});

Reads file asynchronously, allowing Node.js to handle other tasks while waiting for file data.

📈 Performance GainNon-blocking I/O improves responsiveness and throughput

Reading a file without blocking the main thread

Node.js

const fs = require('fs');
const data = fs.readFileSync('file.txt', 'utf8');
console.log(data);

This blocks the entire Node.js event loop until the file is read, causing delays in handling other requests or events.

📉 Performance CostBlocks event loop for duration of file read, causing input lag and slower response

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
Synchronous file read	N/A	Blocks event loop	N/A	[X] Bad
Asynchronous file read with callback	N/A	Non-blocking	N/A	[OK] Good

Rendering Pipeline

Asynchronous file reading with callbacks allows Node.js to continue processing other events without waiting, improving event loop efficiency and responsiveness.

→Event Loop

→I/O Operations

⚠️ BottleneckBlocking synchronous file reads stall the event loop, delaying all other operations.

Core Web Vital Affected

INP

This affects how fast the page or server can respond while waiting for file data, impacting input responsiveness and overall user experience.

Optimization Tips

1Never use synchronous file reading in a server environment to avoid blocking the event loop.

2Use asynchronous file reading with callbacks or promises to keep your app responsive.

3Monitor event loop blocking in DevTools Performance panel to detect slow file operations.

Performance Quiz - 3 Questions

What is the main performance benefit of reading files asynchronously with callbacks in Node.js?

A It prevents blocking the event loop, keeping the app responsive.

B It reduces the file size on disk.

C It speeds up the file system hardware.

D It automatically caches the file in memory.

DevTools: Performance

How to check: Record a performance profile while running your Node.js app reading files synchronously and asynchronously. Look for event loop blocking times.

What to look for: Long blocking tasks indicate synchronous file reads; short or no blocking indicates asynchronous reads.

Practice

1. What is the main purpose of using fs.readFile with a callback in Node.js?

easy

A. To delete a file from the system

B. To write data to a file synchronously

C. To create a new directory

D. To read a file asynchronously without blocking the program

Solution

1. Step 1: Understand fs.readFile role

   fs.readFile reads files without stopping other code from running.

2. Step 2: Recognize asynchronous behavior

   Using a callback means the program continues while the file is read, improving speed.

3. Final Answer:

   To read a file asynchronously without blocking the program -> Option D

4. Quick Check:

   Asynchronous reading = non-blocking file read [OK]

Hint: Remember: async means non-blocking, callback runs after reading [OK]

Common Mistakes:

• Confusing reading with writing files
• Thinking fs.readFile is synchronous
• Ignoring the callback function

2. Which of the following is the correct syntax to read a file named data.txt asynchronously using fs.readFile with a callback?

easy

A. fs.readFile('data.txt');

B. fs.readFile('data.txt', data => { console.log(data); });

C. fs.readFile('data.txt', (err, data) => { if (err) throw err; console.log(data); });

D. fs.readFile('data.txt', (data, err) => { if (err) throw err; console.log(data); });

Solution

1. Step 1: Check callback parameters order

   The callback receives err first, then data.

2. Step 2: Verify error handling and usage

   fs.readFile('data.txt', (err, data) => { if (err) throw err; console.log(data); }); correctly checks for error and logs data inside the callback.

3. Final Answer:

   fs.readFile('data.txt', (err, data) => { if (err) throw err; console.log(data); }); -> Option C

4. Quick Check:

   Callback params = (err, data) [OK]

Hint: Callback always has error first, then data [OK]

Common Mistakes:

• Swapping error and data parameters
• Omitting the callback function
• Not handling errors inside callback

3. What will be the output of the following code if example.txt contains the text "Hello World"?

const fs = require('fs');
fs.readFile('example.txt', (err, data) => {
  if (err) {
    console.log('Error reading file');
  } else {
    console.log(data.toString());
  }
});

medium

A. Error reading file

B. Hello World

C. [object Object]

D. undefined

Solution

1. Step 1: Understand callback behavior

   If no error, data contains file content as a Buffer.

2. Step 2: Convert Buffer to string

   data.toString() converts Buffer to readable text, so it prints "Hello World".

3. Final Answer:

   Hello World -> Option B

4. Quick Check:

   Buffer.toString() = file text [OK]

Hint: Use toString() to read file content as text [OK]

Common Mistakes:

• Printing Buffer object directly without conversion
• Ignoring error handling
• Expecting synchronous output

4. Identify the error in this code snippet that reads a file asynchronously:

const fs = require('fs');
fs.readFile('notes.txt', (data, err) => {
  if (err) {
    console.error('Failed to read file');
  } else {
    console.log(data.toString());
  }
});

medium

A. The callback parameters are reversed; error should be first

B. Missing encoding option in readFile

C. Using console.error instead of console.log

D. File path should be absolute

Solution

1. Step 1: Check callback parameter order

   The callback must have err as first parameter, then data.

2. Step 2: Understand impact of reversed parameters

   Reversing causes data to receive error and err to receive data, breaking error check.

3. Final Answer:

   The callback parameters are reversed; error should be first -> Option A

4. Quick Check:

   Callback params order = (err, data) [OK]

Hint: Error always comes first in callback parameters [OK]

Common Mistakes:

• Swapping error and data parameters
• Not handling errors properly
• Assuming encoding is mandatory

5. You want to read multiple files asynchronously and log their contents in order: file1.txt, file2.txt, and file3.txt. Which approach correctly ensures the files are read and logged in sequence using callbacks?

hard

A. Call fs.readFile for each file inside the previous file's callback

B. Call fs.readFile for all files at once without nesting callbacks

C. Use synchronous fs.readFileSync for all files

D. Use fs.readFile with promises instead of callbacks

Solution

1. Step 1: Understand asynchronous reading order

   Calling fs.readFile without nesting may log files out of order.

2. Step 2: Use nested callbacks to enforce sequence

   Reading each file inside the previous file's callback ensures order.

3. Final Answer:

   Call fs.readFile for each file inside the previous file's callback -> Option A

4. Quick Check:

   Nested callbacks = ordered async reads [OK]

Hint: Nest callbacks to keep async file reads in order [OK]

Common Mistakes:

• Calling all reads at once expecting order
• Using synchronous reads in async code
• Confusing promises with callbacks