Passive onscroll event listener

on-scroll.js

onScroll(window, (scrollX, scrollY) => {
  log({ scrollX, scrollY })
})

function onScroll(target: HTMLElement, fn) {
  const onscroll = (_evt) => fn(target.scrollX, target.scrollY);
  if (supportsPassive()) {
    target.addEventListener("scroll", onscroll, { passive: true })
  } else {
    let timer
    addEventListener("scroll", (evt) => {
      clearTimeout(timer)
      timer = setTimeout(onscroll.bind(null, evt), 10)
    })
  }
}

function supportsPassive() {
  var supportsPassiveOption = false;
  try {
    var opts = Object.defineProperty({}, 'passive', {
      get: function() {
        supportsPassiveOption = true;
      }
    });
    window.addEventListener('test', null, opts);
  } catch (e) {}
  return supportsPassiveOption;
}