JSFiddle - React, Tailwind, and code Playground

by allcaps

HTML

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<a id='target'>Click this a few times. The text will update each click BUT with a 5s throttle.</a>

CSS

#target {
  display: block;
  width: 200px;
  height: 200px;
  background: red;
}

JavaScript

function throttle(fn, threshhold, scope) {
  threshhold || (threshhold = 3000);
  var last,
      deferTimer;
  return function () {
    var context = scope || this;

    var now = +new Date,
        args = arguments;
    if (last && now < last + threshhold) {
      // hold on to it
      clearTimeout(deferTimer);
      deferTimer = setTimeout(function () {
        last = now;
        fn.apply(context, args);
      }, threshhold);
    } else {
      last = now;
      fn.apply(context, args);
    }
  };
}

$('#target').click(throttle(function (event) {
  $('#target').text(Date())
}, 5000));