Feature Request: Add debounce method
See original GitHub issueThis is a feature request for adding a debounce function to the async module.
I always use a debounce
function along with the Deno.watchFs
method and I have seen it in other projects as well.
So I think this is a useful function that could be added to deno/std
.
I have already opened a PR with a first version of how the module could look like (#1006).
I added it to the async
module rn, but i’m not sure if that’s the best place.
Proposed typings:
declare interface DebouncedFunction<T extends Array<unknown>> {
/** Calls the function with a delay. */
(...args: T): void;
/** Clears the debounce timeout without calling the debounced function. */
clear(): void;
/** Clears the debounce timeout with calling the debounced function immediately. */
flush(): void;
/** Returns a boolean wether a debounce call is pending or not. */
readonly pending: boolean;
}
declare function debounce<T extends Array<any>>(
func: (this: DebouncedFunction<T>, ...args: T) => void,
wait: number,
): DebouncedFunction<T>;
Usage example:
import { debounce } from "https://deno.land/std/async/debounce.ts";
const log: DebouncedFunction<[string]> = debounce(
(param: string) => console.log(param),
200,
);
log("foo");
log("bar");
log("baz");
// wait 200ms ...
// output: baz
Issue Analytics
- State:
- Created 2 years ago
- Comments:11 (10 by maintainers)
Top Results From Across the Web
Debounce – How to Delay a Function in JavaScript (JS ES6 ...
In JavaScript, a debounce function makes sure that your code is only triggered once per user input. Search box suggestions, text-field ...
Read more >Debounce in JavaScript — Improve Your Application's ...
The debounce function delays the processing of the keyup event until the user has stopped typing for a predetermined amount of time. This...
Read more >How to use debouncing to Improve the performance of the ...
In this article, we will see a very powerful and must-use technique to improve the performance of search functionality in the application.
Read more >How to use the debounce function in JavaScript - Educative.io
The Send Request() function is debounced. Requests are sent only after fixed time intervals regardless of how many times the user presses the...
Read more >Implement Debouncing in React in 3 Different Ways
Let's make a function debounce. It will return us another function (an optimized function). The logic behind this function will be that only...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I was just looking through the project to see if we have some conventions on how we name function types.
It seems that for properties and variables we mostly use
fn
as naming convention. For types and interfaces we mostly use the conventionFooFunction
.testing/bench.ts
BenchmarkFunction
datetime/tokenizer.ts
TestFunction
,CallbackFunction
encoding/_yaml/parse.ts
CbFunction
log/handlers.ts
FormatterFunction
node/events.ts
GenericFunction
,WrappedFunction
node/module.ts
RequireFunction
examples/xeval.ts
XevalFunc
So, i think we should go with
DebouncedFunction
to be consistent.That sounds great, let’s go with that! thanks for the due diligence on this