Debouncing and Throttling in Livewire v4

<!-- Debounce search input - waits 300ms after user stops typing -->
<input 
    type="search"
    wire:model.live.debounce.300ms="search"
    placeholder="Search products..."
>

<!-- Different debounce durations -->
<input wire:model.live.debounce.150ms="quickSearch">
<input wire:model.live.debounce.500ms="slowSearch">
<textarea wire:model.live.debounce.1s="content"></textarea>

<!-- Throttle button clicks - max once per 500ms -->
<button wire:click.throttle.500ms="refresh">
    Refresh Data
</button>

<!-- Throttle scroll events -->
<div 
    x-data 
    @scroll.window.throttle.200ms="$wire.loadMore()"
>
    Scroll content...
</div>

<!-- Throttle rapid form submissions -->
<form wire:submit.throttle.1s="save">
    <button type="submit">Save</button>
</form>

Debounce: Waits until user STOPS, then fires once
- Use for: Search inputs, auto-save, validation
- Example: User types "hello" - fires once after typing stops

Throttle: Fires immediately, then limits frequency  
- Use for: Scroll handlers, resize events, rapid clicks
- Example: User clicks 10 times - fires max 2 times per second