javascript debounce concepts.

javascript debounce concepts.

আমাদের অনেক সময় ইউজার ভুল করতে পারে এমন কাজ গুলোকেও হ্যান্ডলে করতে হয় । যেমন একটা e-commrace ওয়েবসাইট এ একজন ইউজার চাইলেই কিছু প্রডাক্ট কার্টে অ্যাড করে অর্ডার করতে পারে । এমন তো হতেই পারে যে ইউজার ভুল করে অর্ডার বাটনে কয়েকবার ক্লিক করে ফেলছে । এমন সময়ে তো আমাদের কয়েকটা অর্ডার নেওয়ার দরকার নেই । এটা ভুল এটার কারণে একটা e-commrace ওয়েবসাইটের ক্ষতি হতে পারে । তাই এমন দুর্ঘটনা ঠেকাতে আমারা debounce এঁর খুব স্বাধারন কঞ্চেপ্ট কাজে লাগাতে পারি ।

const button = document.getElementById("btn");
function debounce(fn, ms) {
 let timeoutId;
 return function () {
  if (timeoutId) {
   clearInterval();
  }
  timeoutId = setTimeout(() => {
   fn();
  }, ms);
 };
}
button.addEventListener("click", () => {
 debounce(function () {
  console.log("button clicked");
 }, 1000);
});