JSFiddle - React, Tailwind, and code Playground

by shivaay123

HTML

<html>
    <head>
        <title>JS debounce</title>
        <link href="https://fonts.googleapis.com/css2?family=Jua&family=Roboto:wght@300&display=swap" rel="stylesheet"> 
    </head>
    <body>
        <main>
            <div class="hea">
                <h1>JS debounce</h1>
                <input type="text" onkeyup="workonChange()" />
                <button onclick="workonChange()">Click here</button>
            </div>
        </main>
    </body>
</html>

JavaScript

function debounce(jss, timeout = 3000){
  let timer;
  return (...args) => {
    clearTimeout(timer);
    timer = setTimeout(() => { jss.apply(this, args); }, timeout);
  };
}
  
function userInput(){
  console.log('Changing data');
}

const workonChange = debounce(() => userInput());