IndexedDB and Web-workers

About

This demo shows one of the benefits of using indexed db in a webworker.

The generated data, which is an array of integers is used to simulate "work". The data is being sent to the WebWorker using an IndexedDB database, which is being populated on the main thread. The WebWorker then fetches the entire data set and processes it.

Processing the data in the main thread will caused the browser to be "stuck" for a while, while the webworker doesn't halt the animation and actually updates the UI correctly.

The lower progress bar will turn green after the data was completely processed.

More @ GitHub.

Usage

To generate a new set of data (delays) choose the properties and press "Generate data".

To see how this data is being processed on the main thread or persisted in IndexedDB and processed in a webworker click the corresponding buttons.

Try 10000 : 1 , 2500 : 10, 1000 : 25 . You will notice the overhead of storing the data and reading it entirely is not affecting the site's performance.