res.redirect for redirections in Express - Performance & Optimization

Performance: res.redirect for redirections

MEDIUM IMPACT

This affects page load speed by causing an additional HTTP request and response cycle before the final content loads.

Redirecting a user to another page after a request

Express

app.get('/old-page', (req, res) => {
  res.status(200).sendFile(__dirname + '/path/to/new-page.html');
});

Serves the final content directly without extra HTTP round trips.

📈 Performance GainEliminates extra request, improving LCP by 100-300ms

Redirecting a user to another page after a request

Express

app.get('/old-page', (req, res) => {
  res.redirect('/new-page');
});

This causes the browser to make a second HTTP request to '/new-page', increasing load time.

📉 Performance CostAdds 1 extra HTTP request, delaying LCP by 100-300ms depending on network

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
res.redirect causing extra HTTP request	N/A	N/A	Blocks initial paint until redirect completes	[X] Bad
Directly serving final content without redirect	N/A	N/A	Paints content on first response	[OK] Good

Rendering Pipeline

res.redirect sends a 3xx HTTP status causing the browser to pause rendering and request a new URL, delaying content paint.

→Network Request

→HTML Parsing

→Rendering

⚠️ BottleneckNetwork Request due to extra HTTP round trip

Core Web Vital Affected

LCP

This affects page load speed by causing an additional HTTP request and response cycle before the final content loads.

Optimization Tips

1Avoid unnecessary res.redirect calls to reduce extra HTTP requests.

2Each redirect adds network latency and delays Largest Contentful Paint.

3Serve final content directly when possible to improve user experience.

Performance Quiz - 3 Questions

What is the main performance cost of using res.redirect in Express?

A It blocks JavaScript execution

B It causes an extra HTTP request delaying page load

C It increases DOM nodes on the page

D It causes CSS recalculation

DevTools: Network

How to check: Open DevTools, go to Network tab, reload page and look for 3xx redirect status codes before final 200 response.

What to look for: Presence of 301/302 status and extra request delaying final content load

Practice

1. What does res.redirect('/home') do in an Express app?

easy

A. Sends a JSON response with '/home' data

B. Stops the server from running

C. Sends the user to the '/home' URL automatically

D. Logs '/home' to the console

Solution

1. Step 1: Understand res.redirect purpose

   The res.redirect method sends an HTTP redirect response to the client, telling the browser to go to a new URL.

2. Step 2: Analyze the argument '/home'

   Passing '/home' means the user will be redirected to the '/home' path on the same server.

3. Final Answer:

   Sends the user to the '/home' URL automatically -> Option C

4. Quick Check:

   res.redirect('/home') = Redirect to '/home' [OK]

Hint: res.redirect sends user to given URL automatically [OK]

Common Mistakes:

• Thinking it sends JSON data
• Confusing redirect with stopping server
• Assuming it logs to console

2. Which is the correct syntax to redirect permanently to '/dashboard' in Express?

easy

A. res.redirect('/dashboard', 301);

B. res.redirect(301, '/dashboard');

C. res.redirectPermanent('/dashboard');

D. res.redirectPermanent(301, '/dashboard');

Solution

1. Step 1: Recall res.redirect syntax for status code

   Express uses res.redirect(statusCode, url) to specify redirect type.

2. Step 2: Identify correct order of arguments

   The status code (301) must come first, then the URL string.

3. Final Answer:

   res.redirect(301, '/dashboard'); -> Option B

4. Quick Check:

   Status code first, URL second = res.redirect(301, '/dashboard'); [OK]

Hint: Status code goes first in res.redirect(status, url) [OK]

Common Mistakes:

• Swapping arguments order
• Using non-existent res.redirectPermanent method
• Passing status code as second argument

3. What will the browser do after this Express code runs?

app.get('/old', (req, res) => {
  res.redirect('/new');
});

medium

A. Show the content of '/old' page

B. Send a JSON response with '/new' data

C. Return a 404 error

D. Redirect the browser to '/new' URL

Solution

1. Step 1: Understand route handler behavior

   The handler for '/old' calls res.redirect('/new'), which sends a redirect response.

2. Step 2: Browser reaction to redirect

   The browser receives the redirect and automatically requests the '/new' URL instead of '/old'.

3. Final Answer:

   Redirect the browser to '/new' URL -> Option D

4. Quick Check:

   res.redirect('/new') = Browser goes to '/new' [OK]

Hint: res.redirect sends browser to new URL automatically [OK]

Common Mistakes:

• Expecting original page content to show
• Thinking it returns 404 error
• Confusing redirect with JSON response

4. Find the error in this Express code snippet:

app.get('/start', (req, res) => {
  res.redirect('/end', 302);
});

medium

A. The status code should be first argument, not second

B. res.redirect cannot be used inside app.get

C. The URL must be absolute, not relative

D. 302 is not a valid redirect status code

Solution

1. Step 1: Check res.redirect argument order

   Express expects res.redirect(statusCode, url), status code first.

2. Step 2: Identify incorrect argument order

   The code uses res.redirect('/end', 302), which is reversed and causes unexpected behavior.

3. Final Answer:

   The status code should be first argument, not second -> Option A

4. Quick Check:

   Correct order: status, URL [OK]

Hint: Status code must come before URL in res.redirect [OK]

Common Mistakes:

• Swapping status and URL arguments
• Thinking res.redirect can't be used in routes
• Believing relative URLs are invalid
• Assuming 302 is invalid status

5. You want to redirect users from '/login' to '/dashboard' only if they are logged in. Which code correctly uses res.redirect to do this?

hard

A. if (req.user) { res.redirect('/dashboard'); } else { res.send('Please login'); }

B. res.redirect('/dashboard'); if (req.user) { res.send('Welcome'); }

C. res.redirect(302, '/dashboard'); res.send('Logged in');

D. if (!req.user) { res.redirect('/dashboard'); } else { res.send('Please login'); }

Solution

1. Step 1: Check login condition usage

   The code must check if req.user exists to confirm login.

2. Step 2: Redirect only if logged in

   If logged in, redirect to '/dashboard'; otherwise, send a message to login.

3. Step 3: Verify correct use of res.redirect and res.send

   if (req.user) { res.redirect('/dashboard'); } else { res.send('Please login'); } correctly calls res.redirect inside the if block and sends response otherwise, avoiding multiple responses.

4. Final Answer:

   if (req.user) { res.redirect('/dashboard'); } else { res.send('Please login'); } -> Option A

5. Quick Check:

   Redirect only when logged in = if (req.user) { res.redirect('/dashboard'); } else { res.send('Please login'); } [OK]

Hint: Redirect inside if block after login check [OK]

Common Mistakes:

• Calling res.redirect without condition
• Sending multiple responses in one request
• Redirecting when user is not logged in