Set and cancel timers which can be paused and resumed

timers.js

(() => {
"use strict";

/* Why don't overwrite setTimeout()? It's doable but...
 * https://www.adequatelygood.com/Replacing-setTimeout-Globally.html
 * Also we may want to keep running high priority timers one day. */

const timers = [];
const state = {
	paused: false,
	index: 0,
};

function setTimer(cb, delay) {
	const id = ++state.index;
	const expire = (new Date).getTime() + delay;
	const timer = {id,cb,delay,expire};

	timers.push(timer);
	if(!state.paused)
		schedule(id);
	return id;
}

function schedule(id) {
	const timer = timers.find(x => x.id == id);

	if(!timer)
		return;
	timer.tm = setTimeout(() => {
		timer.cb();
		delete timer.tm;
		clearTimer(id);
	}, timer.delay)
}

function clearTimer(id) {
	const timer = timers.find(x => x.id == id);
	let index;

	if(!timer)
		return;
	if(timer.tm)
		clearTimeout(timer.tm);
	index = timers.findIndex(x => x.id == id);
	timers.splice(index, 1);
}

function clearAllTimers() {
	timers.forEach(x => clearTimer(x.id));
}

function pauseAll() {
	state.paused = true;
	timers.forEach(timer => {
		clearTimeout(timer.tm);
		delete timer.tm;
	});
}

function resumeAll() {
	state.paused = false;
	timers.forEach(timer => {
		const time = (new Date()).getTime();

		timer.delay = timer.expire - time;
		if(timer.delay < 0)
			timer.delay = 0;
		schedule(timer.id);
	});
}

/* public */
Object.assign(window, {
	pauseAll,
	resumeAll,
	setTimer,
	clearTimer,
	clearAllTimers
});

})();

Sample usage:

addEventListener("visibilitychange", () => {
  const visible = document.visibilityState == "visible";
  
  if(visible)
    return resumeAll();
  return pauseAll();
});

Have fun.