CRUD operations in Flask - Performance & Optimization

Performance: CRUD operations

MEDIUM IMPACT

CRUD operations impact server response time and client rendering speed, affecting how quickly users see updates and interact with data.

Updating data on the server and reflecting changes on the client

Flask

from flask import Flask, request, jsonify
app = Flask(__name__)

@app.route('/update', methods=['POST'])
def update():
    data = request.json['data']
    # Update database asynchronously or quickly
    update_database_async(data)
    return jsonify({'status': 'success', 'data': data})

Returns JSON response quickly, enabling client-side JavaScript to update UI without full reload.

📈 Performance Gainnon-blocking response; avoids full page reload; improves INP by 50-80%

Updating data on the server and reflecting changes on the client

Flask

from flask import Flask, request, render_template
app = Flask(__name__)

@app.route('/update', methods=['POST'])
def update():
    data = request.form['data']
    # Update database synchronously
    update_database(data)  # blocking call
    return render_template('page.html', data=data)

Blocking database update delays server response and forces full page reload, causing slow user experience.

📉 Performance Costblocks rendering for 200-500ms depending on DB latency; triggers full page reload

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
Synchronous full page reload after CRUD	High (full DOM reload)	Multiple reflows	High paint cost	[X] Bad
Asynchronous JSON response with client-side update	Low (partial DOM update)	Single reflow	Low paint cost	[OK] Good

Rendering Pipeline

CRUD operations affect the server response phase and client rendering. Slow server responses delay DOM updates, increasing input latency.

→Server Processing

→Network

→DOM Update

→Paint

⚠️ BottleneckServer Processing and Network latency

Core Web Vital Affected

INP

CRUD operations impact server response time and client rendering speed, affecting how quickly users see updates and interact with data.

Optimization Tips

1Avoid blocking server calls during CRUD to reduce input delay.

2Use JSON responses and client-side updates to prevent full page reloads.

3Minimize data sent over network to speed up server response.

Performance Quiz - 3 Questions

Which CRUD pattern improves interaction responsiveness in a Flask app?

A Return JSON response and update UI with JavaScript

B Reload the entire page after each CRUD operation

C Perform database updates synchronously and block response

D Send large HTML pages for every update

DevTools: Performance

How to check: Record a performance profile while performing a CRUD operation. Look for long server processing times and full page reloads.

What to look for: Long blocking times in server response and multiple layout/repaint events indicate poor CRUD performance.

Practice

1. What does the 'CRUD' acronym stand for in Flask web development?

easy

A. Cache, Route, User, Data

B. Connect, Run, Upload, Download

C. Code, Render, Use, Deploy

D. Create, Read, Update, Delete

Solution

1. Step 1: Understand CRUD basics

   CRUD is a common term in web development describing four basic operations on data.

2. Step 2: Match each letter to its meaning

   C stands for Create, R for Read, U for Update, and D for Delete.

3. Final Answer:

   Create, Read, Update, Delete -> Option D

4. Quick Check:

   CRUD = Create, Read, Update, Delete [OK]

Hint: Remember CRUD as the four main data actions [OK]

Common Mistakes:

• Confusing CRUD with unrelated terms
• Mixing up the order of operations
• Thinking CRUD refers to Flask-specific commands

2. Which HTTP method is typically used in Flask to update an existing resource in a CRUD API?

easy

A. PUT

B. POST

C. GET

D. DELETE

Solution

1. Step 1: Identify HTTP methods for CRUD

   GET is for reading, POST for creating, PUT for updating, DELETE for deleting.

2. Step 2: Match update operation

   Updating a resource uses the PUT method in RESTful APIs like Flask.

3. Final Answer:

   PUT -> Option A

4. Quick Check:

   Update = PUT method [OK]

Hint: Update uses PUT method in REST APIs [OK]

Common Mistakes:

• Using POST instead of PUT for updates
• Confusing GET with update actions
• Using DELETE for updating data

3. Given this Flask route code snippet, what will be the output when a DELETE request is sent to /item/5?

from flask import Flask, jsonify
app = Flask(__name__)
items = {1: 'apple', 5: 'banana'}

@app.route('/item/', methods=['DELETE'])
def delete_item(id):
    if id in items:
        del items[id]
        return jsonify({'message': 'Deleted'}), 200
    else:
        return jsonify({'error': 'Not found'}), 404

medium

A. {"error": "Not found"} with status 404

B. {"message": "Deleted"} with status 200

C. SyntaxError due to missing return statement

D. 500 Internal Server Error

Solution

1. Step 1: Check if item with id 5 exists

   The dictionary items contains key 5 with value 'banana'.

2. Step 2: Analyze DELETE request handling

   Since id 5 exists, it is deleted and a JSON message 'Deleted' with status 200 is returned.

3. Final Answer:

   {"message": "Deleted"} with status 200 -> Option B

4. Quick Check:

   Item 5 exists, so deletion returns success message [OK]

Hint: Check if key exists before delete to decide response [OK]

Common Mistakes:

• Assuming item does not exist and returning 404
• Forgetting to delete the item before returning
• Confusing status codes for success and error

4. Identify the error in this Flask route for creating a new item:

@app.route('/item', methods=['POST'])
def create_item():
    data = request.json
    items.append(data['name'])
    return jsonify({'message': 'Item added'}), 201

medium

A. Missing import of request from flask

B. Using append on a dictionary instead of a list

C. Incorrect HTTP method for creating resource

D. Returning wrong status code

Solution

1. Step 1: Check for necessary imports

   The code uses request.json but does not import request from flask.

2. Step 2: Verify data structure usage

   Assuming items is a list, append is valid; HTTP method POST is correct; status 201 is correct.

3. Final Answer:

   Missing import of request from flask -> Option A

4. Quick Check:

   request must be imported to access request.json [OK]

Hint: Always import request to access JSON data in Flask [OK]

Common Mistakes:

• Forgetting to import request
• Using append on a dict instead of list
• Using GET instead of POST for creation

5. You want to implement a Flask route to update an item only if it exists, otherwise return a 404 error. Which code snippet correctly performs this update using JSON data sent in a PUT request? A)

@app.route('/item/', methods=['PUT'])
def update_item(id):
    data = request.json
    items[id] = data['name']
    return jsonify({'message': 'Updated'}), 200

B)

@app.route('/item/', methods=['PUT'])
def update_item(id):
    if id not in items:
        return jsonify({'error': 'Not found'}), 404
    data = request.json
    items[id] = data['name']
    return jsonify({'message': 'Updated'}), 200

C)

@app.route('/item/', methods=['POST'])
def update_item(id):
    data = request.json
    if id in items:
        items[id] = data['name']
    return jsonify({'message': 'Updated'}), 200

D)

@app.route('/item/', methods=['PUT'])
def update_item(id):
    data = request.json
    if id in items:
        items[id] = data['name']
    else:
        items[id] = 'default'
    return jsonify({'message': 'Updated'}), 200

hard

A. Updates without checking existence, always returns 200

B. Uses POST method incorrectly for update

C. Checks existence, updates if found, else returns 404

D. Adds default if not found instead of 404 error

Solution

1. Step 1: Verify HTTP method and existence check

   Checks existence, updates if found, else returns 404 uses PUT method and checks if id exists before updating.

2. Step 2: Confirm correct response for missing item

   If id not found, it returns 404 error, which is correct behavior for update.

3. Final Answer:

   Checks existence, updates if found, else returns 404 -> Option C

4. Quick Check:

   Update with existence check returns 404 if missing [OK]

Hint: Always check if item exists before update to avoid errors [OK]

Common Mistakes:

• Not checking if item exists before update
• Using POST instead of PUT for update
• Adding default values instead of error on missing item