{
"id": 1,
"title": "Debounce Function",
"summary": "Delays function execution until after wait time has elapsed",
"description": "A utility function that delays the execution of a function until after a specified wait time has elapsed since the last time it was invoked.\n\n**Key Features:**\n- Optimizes performance in high-frequency event scenarios\n- Prevents excessive function calls during rapid events\n- Configurable wait time and immediate execution option\n\n**Common Use Cases:**\n- Search input handlers (wait for user to stop typing)\n- Resize and scroll event handlers\n- API call throttling\n- Form validation\n\nThe debounce function ensures that the target function is only executed once after the user has stopped triggering the event for the specified delay period.",
"language": {
"name": "javascript",
"spec": "ES2015"
},
"tags": ["utility", "performance", "events", "optimization"],
"dependencies": [],
"dateAdded": "2025-10-20",
"code": "function debounce(func, wait, immediate = ) {\n let timeout;\n return function executedFunction(...args) {\n const later = () => {\n timeout = null;\n if (!immediate) func(...args);\n };\n const callNow = immediate && !timeout;\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n if (callNow) func(...args);\n };\n}",
"parameters": [
{
"name": "delay",
"label": "Delay (ms)",
"defaultValue": "300",
"type": "number"
},
{
"name": "immediate",
"label": "Execute Immediately",
"defaultValue": "false",
"type": "bool"
}
],
"usage": [
{
"description": "Basic usage with search handler",
"code": "const handleSearch = debounce((query) => {\n console.log('Searching for:', query);\n}, , );"
}
],
"seeAlso": [2, 6],
"attribution": {
"source": "https://github.com/lodash/lodash/blob/master/debounce.js",
"license": "MIT",
"notes": "Lightly adapted for clarity; parameters exposed for demo."
}
}