Why SQL integration matters in Express - Performance Evidence

Performance: Why SQL integration matters

HIGH IMPACT

This affects how quickly data can be retrieved and displayed on the page, impacting load speed and responsiveness.

Fetching user data for a profile page

Express

app.get('/profile', (req, res) => {
  db.query('SELECT * FROM users WHERE id = ?', [req.user.id], (err, results) => {
    if (err) throw err;
    res.render('profile', { user: results[0] });
  });
});

Query filters data in the database, sending only needed data to server and client.

📈 Performance GainReduces data transfer and processing, speeds up server response and LCP.

Fetching user data for a profile page

Express

app.get('/profile', (req, res) => {
  db.query('SELECT * FROM users', (err, results) => {
    if (err) throw err;
    const user = results.find(u => u.id === req.user.id);
    res.render('profile', { user });
  });
});

Fetching all users and filtering in code causes unnecessary data transfer and processing.

📉 Performance CostBlocks server response longer, increases data transfer size, delays LCP.

Performance Comparison

Pattern	Data Transfer	Server Processing	Client Rendering	Verdict
Fetching all rows then filtering	High (large data)	High (filtering in code)	Delayed (waiting for data)	[X] Bad
Filtering in SQL query	Low (only needed data)	Low (minimal processing)	Faster (data ready sooner)	[OK] Good

Rendering Pipeline

SQL integration impacts the server response time which affects when the browser receives data to start rendering. Faster queries mean quicker data delivery, reducing delay before rendering.

→Server Processing

→Network Transfer

→Rendering

⚠️ BottleneckServer Processing due to inefficient queries

Core Web Vital Affected

LCP

This affects how quickly data can be retrieved and displayed on the page, impacting load speed and responsiveness.

Optimization Tips

1Always filter data in SQL queries to reduce data size.

2Avoid fetching unnecessary rows or columns from the database.

3Monitor network payload size and server response time to catch slow queries.

Performance Quiz - 3 Questions

Why is filtering data in the SQL query better than filtering in server code?

A It increases server load but reduces client load.

B It reduces data sent over the network and speeds up server response.

C It makes the code easier to read but does not affect performance.

D It delays the rendering because SQL queries are slower.

DevTools: Network

How to check: Open DevTools, go to Network tab, reload the page, and inspect the size and timing of API calls fetching data.

What to look for: Look for smaller payload sizes and faster response times indicating efficient SQL queries.