https://github.com/kribblo/timeframer

Background setTimeout and setInterval via Webworkers via iframe.
https://github.com/kribblo/timeframer

edge ie10 setinterval settimeout webworker

Last synced: about 1 month ago
JSON representation

Background setTimeout and setInterval via Webworkers via iframe.

• Host: GitHub
• URL: https://github.com/kribblo/timeframer
• Owner: kribblo
• Created: 2017-02-21T17:58:50.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2018-01-18T12:44:53.000Z (about 7 years ago)
• Last Synced: 2024-12-13T17:51:32.253Z (about 1 month ago)
• Topics: edge, ie10, setinterval, settimeout, webworker
• Language: JavaScript
• Homepage:
• Size: 12.7 KB
• Stars: 3
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# timeframer

`setTimeout` and `setInterval` that keeps on ticking when a tab is in the background (they're otherwise throttled). Use with care and only when there's a good use-case.

It works by creating an invisible iframe with a WebWorker that does the actual timers and update ticks via a MessageChannel. This is just a way to make it real simple to avoid cross-domain issues, the iframe and the worker is hosted on the same origin. If you can host your own worker on your own domain, that's much easier. 

All this trickery is due to the Microsoft browsers, all others make do fine with Blob URL's.

This is an initial proof-of-concept.

## Usage

### Include in webpage

From a webpage, make a `` tag with `src` pointing to `timeframer.js` where it and `timeframer.html` is hosted.

`setTimeout`, `clearTimeout`, `setInterval` and `clearInterval` will all be available on the global `window.timeframer`.

You can host it yourself (the `dist` folder), and it's also hosted on GitHub pages at <https://kribblo.github.io/timeframer/timeframer.js>, example:

```html

<script src="https://kribblo.github.io/timeframer/timeframer.js">

    let i = 1;

    let interval = timeframer.setInterval(function() {

        console.log('Interval', i++)

    }, 500)

    timeframer.setTimeout(function() {

        timeframer.clearInterval(interval)

    }, 1600);

```

### Override window.setTimeout and friends

```javascript

window.setTimeout = timeframer.setTimeout;

window.setInterval = timeframer.setInterval;

window.clearTimeout = timeframer.clearTimeout;

window.clearInterval = timeframer.clearInterval;

```

Use caution. If you do this, all timers and intervals in the page will run at full speed in the background, this should only be used where it is needed.

## TODO

* test case/example page

## Development

### Update dist

    npm install

    npm run build

### Publish to gh-pages

    npm run www