signal_throttled

Throttle changing of a Signal value.

Demo

Usage

use leptos::*;
use leptos_use::signal_throttled;

#[component]
fn Demo() -> impl IntoView {
let (input, set_input) = create_signal("");
let throttled: Signal<&'static str> = signal_throttled(input, 1000.0);

view! { }
}

Options

The usual throttle options leading and trailing are available.

use leptos::*;
use leptos_use::{signal_throttled_with_options, ThrottleOptions};

#[component]
fn Demo() -> impl IntoView {
let (input, set_input) = create_signal("");
let throttled: Signal<&'static str> = signal_throttled_with_options(
    input,
    1000.0,
    ThrottleOptions::default().leading(false).trailing(true)
);

view! { }
}

Recommended Reading

• Debounce vs Throttle: Definitive Visual Guide
• Debouncing and Throttling Explained Through Examples

Server-Side Rendering

Internally this uses setTimeout which is not supported on the server. So usually a throttled signal on the server will simply be ignored.

Feature

This function is only available if the crate feature signal_throttled is enabled

Source

Source • Demo • Docs