How to pause every ticking setTimeout and setInterval timer collectively - then unpause/resume/continue when needed

Question

For modern web apps, simulating an app freeze/unfreeze can become necessary. One example is when you don't want the user to miss seeing any of the dynamic content that your page/screen/website/app has to offer when he/she navigates away from the browser tab.

In such cases the desired behavior can be achieved by

1. Pausing all CSS animations using .style.animationPlayState="paused"
2. Pausing all video and audio using .pause()
3. Also pausing all setTimeout and setInterval timers somehow(!)

So the question is simply HOW?

---

Note that a coherent answer to this particular question does not exist under any of the following related titles: 3969475 24724852 21277900 11563382 72751790 41604614

---

Also note that you can detect the exact moment when the user navigates away from and back to your page/app and react to it by using any of the methods mentioned here.

Answer 1

Watch this video and see example1 and example2 to decide whether or not you should be using SuperTimeout-JS

If you do decide to use it then better if you go through the readme carefully.