Back to Prompts
Package 3 prompts

Debouncing & Throttling Prompts

AI prompts for debouncing & throttling from the LearnWithHasan AI Coding Building Blocks (Performance).

#1 Coding Assistant

Debounce a Search Input

Start here. The most common debouncing use case From the Debouncing & Throttling AI Coding Building Block.

Prompt 
My [React / Vue / vanilla JS / other] app has a search box that fires an API call on every keystroke. It's slow and sends way too many requests.

Add debouncing so it only sends a request after the user stops typing for 300ms. While waiting:
- Show a subtle loading indicator after the user starts typing
- Cancel any previous pending request when a new keystroke arrives
- Display results once the final request comes back
- Handle errors gracefully (show a message, don't crash)

My stack: [your framework and language here]

I'm learning, so explain each part simply.
#2 Coding Assistant

Throttle a Scroll or Resize Handler

For scroll-based animations, lazy loading, or resize layouts From the Debouncing & Throttling AI Coding Building Block.

Prompt 
My [app / website] runs a function every time the user scrolls or resizes the window. It's making the page laggy because the function fires hundreds of times per second.

Add throttling so the function runs at most once every [200ms / 100ms / 500ms]. Make sure:
- The first event fires immediately (so it feels responsive)
- The last event also fires (so the final position is captured)
- The UI stays smooth during fast scrolling
- I can easily adjust the throttle interval later

My stack: [your framework and language here]

I'm learning, so explain each part simply.
#3 Coding Assistant

Auto-Save a Form with Debounce

For editors, note apps, or any form with auto-save From the Debouncing & Throttling AI Coding Building Block.

Prompt 
My [app] has a form (or text editor) where I want to auto-save the user's work as they type, but without flooding the server with save requests on every keystroke.

Set up a debounced auto-save that:
- Saves automatically [1 second / 2 seconds] after the user stops editing
- Shows a "Saving..." indicator while the save is in progress
- Shows "Saved ✓" when the server confirms
- If the user keeps typing, resets the timer (doesn't save mid-sentence)
- Handles save failures with a retry and a visible warning
- Saves immediately when the user navigates away (don't lose work)

My stack: [your framework and language here]

I'm learning, so explain each part simply.
21 views