Как ограничить выполнение функции mousemove 1 раз в секунду?

Добрый день есть такая функция

$('body').mousemove(function(evt){
    if(evt.target.classList[0] == 'home-shadow'){
      var totalWidth = $('.home-shadow').width()
      var rect = evt.target.getBoundingClientRect()
      var x = evt.clientX - rect.left; 
      var percent = x*100 / totalWidth
      console.log(percent)

      var styleElem = document.head.appendChild(document.createElement("style"));

      styleElem.innerHTML = `#home-shadow:before {background-position: ${percent}% 50%`;
    }
  });

Все работает хорошо и эта функция меняет позицию фона, но проблема в том что mousemove выполняется при каждом px мышки, и так и должно работать но и за этого функция выполняется очень часто и даже мой ноут включает кулер в этот момент. Вопрос, как сделать что бы

styleElem.innerHTML = `#home-shadow:before {background-position: ${percent}% 50%`;

Имела ограничения на выполнение 1 раз в секунду?