Created
September 22, 2021 18:12
-
-
Save jzi96/f0f3bb6d24ac43a123a96ad4afdadc87 to your computer and use it in GitHub Desktop.
Sample for debouncing and throttling events in .net(5)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@page "/" | |
<h2>Throttle</h2> | |
<input type="text" @oninput="onInputThrottled" /> | |
Value: @value1 | |
<h2>Debounce</h2> | |
<input type="text" @oninput="onInputDebounced" /> | |
Value: @value2 | |
@code{ | |
string value1; | |
string value2; | |
Action<ChangeEventArgs> onInputDebounced; | |
Action<ChangeEventArgs> onInputThrottled; | |
protected override void OnInitialized() | |
{ | |
onInputThrottled = ThrottleEvent<ChangeEventArgs>(e => value1 = (string)e.Value, TimeSpan.FromSeconds(1)); | |
onInputDebounced = DebounceEvent<ChangeEventArgs>(e => value2 = (string)e.Value, TimeSpan.FromSeconds(1)); | |
base.OnInitialized(); | |
} | |
Action<T> DebounceEvent<T>(Action<T> action, TimeSpan interval) | |
{ | |
return Debounce<T>(arg => | |
{ | |
InvokeAsync(() => | |
{ | |
action(arg); | |
StateHasChanged(); | |
}); | |
}, interval); | |
} | |
Action<T> ThrottleEvent<T>(Action<T> action, TimeSpan interval) | |
{ | |
return Throttle<T>(arg => | |
{ | |
InvokeAsync(() => | |
{ | |
action(arg); | |
StateHasChanged(); | |
}); | |
}, interval); | |
} | |
// Debounce and Throttle can be moved to another class | |
Action<T> Debounce<T>(Action<T> action, TimeSpan interval) | |
{ | |
if (action == null) throw new ArgumentNullException(nameof(action)); | |
var last = 0; | |
return arg => | |
{ | |
var current = System.Threading.Interlocked.Increment(ref last); | |
Task.Delay(interval).ContinueWith(task => | |
{ | |
if (current == last) | |
{ | |
action(arg); | |
} | |
}); | |
}; | |
} | |
Action<T> Throttle<T>(Action<T> action, TimeSpan interval) | |
{ | |
if (action == null) throw new ArgumentNullException(nameof(action)); | |
Task task = null; | |
var l = new object(); | |
T args = default; | |
return (T arg) => | |
{ | |
args = arg; | |
if (task != null) | |
return; | |
lock (l) | |
{ | |
if (task != null) | |
return; | |
task = Task.Delay(interval).ContinueWith(t => | |
{ | |
action(args); | |
task = null; | |
}); | |
} | |
}; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment