HTTP methods for CRUD operations in Express - Performance & Optimization

Performance: HTTP methods for CRUD operations

MEDIUM IMPACT

This concept affects the server response time and client-side rendering speed by how efficiently HTTP methods handle data operations.

Handling data creation, reading, updating, and deleting in an API

Express

app.post('/items', (req, res) => { /* create */ });
app.get('/items/:id', (req, res) => { /* read */ });
app.put('/items/:id', (req, res) => { /* update */ });
app.delete('/items/:id', (req, res) => { /* delete */ });

Using proper HTTP methods clarifies intent, enables caching, and improves routing efficiency.

📈 Performance GainReduces server load and improves interaction responsiveness (INP).

Handling data creation, reading, updating, and deleting in an API

Express

app.post('/items', (req, res) => { /* create */ });
app.post('/items/read', (req, res) => { /* read */ });
app.post('/items/update', (req, res) => { /* update */ });
app.post('/items/delete', (req, res) => { /* delete */ });

Using POST for all CRUD operations causes unclear intent and inefficient caching and routing.

📉 Performance CostIncreases server processing time and blocks efficient caching, leading to slower response times.

Performance Comparison

Pattern	Server Processing	Network Efficiency	Caching	Verdict
Using POST for all CRUD	High (all requests treated same)	Low (no caching benefits)	None	[X] Bad
Using correct HTTP methods	Low (clear routing)	High (GET can be cached)	Enabled	[OK] Good

Rendering Pipeline

HTTP methods affect how the server processes requests and sends responses, impacting the time before the browser can render updated content.

→Server Processing

→Network Transfer

→Client Rendering

⚠️ BottleneckServer Processing due to inefficient method usage

Core Web Vital Affected

INP

This concept affects the server response time and client-side rendering speed by how efficiently HTTP methods handle data operations.

Optimization Tips

1Use GET for reading data to enable caching and faster responses.

2Use POST for creating new data to clearly indicate intent.

3Use PUT for updating and DELETE for removing data to optimize server routing.

Performance Quiz - 3 Questions

Which HTTP method should be used to retrieve data efficiently?

A GET

B POST

C PUT

D DELETE

DevTools: Network

How to check: Open DevTools, go to Network tab, perform CRUD actions, and observe HTTP methods and response times.

What to look for: Check that GET requests are used for reads and can be cached, and that POST/PUT/DELETE are used appropriately with minimal delays.

Practice

1. Which HTTP method is typically used in Express to retrieve data from a server?

easy

A. PUT

B. POST

C. DELETE

D. GET

Solution

1. Step 1: Understand HTTP methods purpose

   GET is used to read or retrieve data from the server without changing it.

2. Step 2: Match method to action

   Since the question asks for retrieving data, GET is the correct method.

3. Final Answer:

   GET -> Option D

4. Quick Check:

   Retrieve data = GET [OK]

Hint: GET always reads data without changing it [OK]

Common Mistakes:

• Confusing POST with GET for reading data
• Using DELETE to get data
• Thinking PUT retrieves data

2. Which of the following is the correct Express syntax to handle a POST request to the path /users?

easy

A. app.get('/users', (req, res) => { ... })

B. app.put('/users', (req, res) => { ... })

C. app.post('/users', (req, res) => { ... })

D. app.delete('/users', (req, res) => { ... })

Solution

1. Step 1: Identify method for creating data

   POST is used to create new data on the server.

2. Step 2: Match Express syntax to POST

   app.post('/users', ...) correctly handles POST requests to /users.

3. Final Answer:

   app.post('/users', (req, res) => { ... }) -> Option C

4. Quick Check:

   POST creates data = app.post() [OK]

Hint: Use app.post() for creating new data routes [OK]

Common Mistakes:

• Using app.get() for POST requests
• Confusing app.put() with app.post()
• Writing app.delete() for creation

3. What will be the response status code if you define this Express route and send a request to PUT /items/5?

app.put('/items/:id', (req, res) => {
  res.status(200).send(`Updated item ${req.params.id}`);
});

medium

A. 200 OK

B. 201 Created

C. 500 Internal Server Error

D. 404 Not Found

Solution

1. Step 1: Analyze route and method

   The route handles PUT requests to /items/:id, so /items/5 matches with id=5.

2. Step 2: Check response status code

   The code explicitly sets status 200 and sends a message, so response status is 200 OK.

3. Final Answer:

   200 OK -> Option A

4. Quick Check:

   PUT route sends status 200 = 200 OK [OK]

Hint: Check res.status() for response code [OK]

Common Mistakes:

• Assuming 201 Created for PUT
• Thinking 404 if route exists
• Confusing 500 error without code

4. Identify the error in this Express route meant to delete a user by ID:

app.delete('/users/:id', (req, res) => {
  const userId = req.params;
  deleteUser(userId);
  res.send('User deleted');
});

medium

A. req.params should be req.params.id to get the ID

B. deleteUser is not a valid Express method

C. res.send should be res.status(204).send()

D. Route path should be '/user/:id' not '/users/:id'

Solution

1. Step 1: Check how userId is assigned

   req.params is an object; to get the ID string, use req.params.id.

2. Step 2: Understand deleteUser usage

   deleteUser likely expects an ID string, so passing the whole params object is wrong.

3. Final Answer:

   req.params should be req.params.id to get the ID -> Option A

4. Quick Check:

   Use req.params.id for ID value [OK]

Hint: Use req.params.id to access route parameters [OK]

Common Mistakes:

• Passing whole req.params object instead of ID
• Confusing route path naming
• Assuming deleteUser is Express built-in

5. You want to update a user's email fully using Express. Which HTTP method and route setup is best practice for this operation?

hard

A. app.post('/users/:id', (req, res) => { ... })

B. app.put('/users/:id', (req, res) => { ... })

C. app.get('/users/:id', (req, res) => { ... })

D. app.delete('/users/:id', (req, res) => { ... })

Solution

1. Step 1: Identify method for full update

   PUT is the HTTP method used to fully update existing data.

2. Step 2: Match route to user ID

   Route '/users/:id' targets a specific user by ID for update.

3. Final Answer:

   app.put('/users/:id', (req, res) => { ... }) -> Option B

4. Quick Check:

   Full update = PUT method [OK]

Hint: Use PUT with ID route for full updates [OK]

Common Mistakes:

• Using POST for updates instead of creation
• Using GET or DELETE for updating data
• Not including :id in route for specific user