Set Video Playback rate

video-playback.js

(function(speed = 1.25) {
  // Set playback rate on a video element
  const setSpeed = (v) => { v.playbackRate = speed; };
  // Listen for play events at document level (capturing phase)
  // so we catch videos added dynamically (e.g. virtualized lists)
  document.addEventListener('play', (e) => {
    if (e.target.tagName === 'VIDEO') setSpeed(e.target);
  }, true);
  const process = (video) => setSpeed(video);
  // Recursively find and process all videos in root, including Shadow DOM
  const scan = (root = document) => {
    root.querySelectorAll?.('video').forEach(process);
    root.querySelectorAll?.('*').forEach((el) => {
      if (el.shadowRoot) scan(el.shadowRoot);
    });
  };
  // Process videos already on page
  scan();
  // Set up MutationObserver to handle videos added later (e.g. on scroll)
  const startObserving = () => {
    new MutationObserver((mutations) => {
      for (const m of mutations)
        for (const n of m.addedNodes)
          if (n?.tagName === 'VIDEO') process(n);
          else if (n?.nodeType === 1) scan(n); // nodeType 1 = element
    }).observe(document.body, { childList: true, subtree: true });
  };
  document.body ? startObserving() : document.addEventListener('DOMContentLoaded', startObserving);
})(1.25);