LWC: debounce a lightning-input

import { LightningElement } from 'lwc';

const DELAY = 300;

export default class ContactSearch extends LightningElement {
    delayTimeout;

    handleKeyChange(event) {
        window.clearTimeout(this.delayTimeout);
        const searchKey = event.target.value;
        this.delayTimeout = window.setTimeout(() => {
            this.dispatchEvent(
                new CustomEvent('search', { detail: { searchKey } })
            );
        }, DELAY);
    }
}

Stop hammering the server on every keystroke — 300 milliseconds of patience per search box.

Gotchas

Read event.target.value BEFORE the timeout — the event is recycled by the time the callback runs. Clear the timeout in disconnectedCallback too if the component can unmount mid-typing.