bifur
Version:
A library providing simple use of asynchronous functionality via Web Workers.
94 lines (83 loc) • 3.78 kB
HTML
<html>
<head>
<title>Bifur</title>
</head>
<body>
<p>Open your console!</p>
<script type="importmap">
{
"imports": {
"bifur": "./dist/Bifur.js"
}
}
</script>
<script type="module">
import Bifur from "bifur";
console.log(Bifur);
let fibonacci = (num) => {
if (num <= 1) return 1;
return fibonacci(num - 1) + fibonacci(num - 2);
}
var i=0;
var now=new Date();
setInterval(_ => {
console.log(`${Math.round((new Date()-now) / 1000)} seconds since we started.`);
},1000);
setTimeout(async _ => {
console.log('Lets work out the 42nd number in fibonacci on the main thread!');
console.log(await new Promise((resolve,reject) => {
console.time('main thread calculation');
resolve(fibonacci(42));
console.timeEnd('main thread calculation');
}));
console.log('Ok, phew, we\'re done!');
},4000);
setTimeout(async _ => {
console.log('Lets work out the 42nd number in fibonacci on a separate thread!');
console.time('separate thread calculation');
console.log(await Bifur.run((num) => {
console.log('running non-persistent');
let fibonacci = (num) => {
if (num <= 1) return 1;
return fibonacci(num - 1) + fibonacci(num - 2);
}
return fibonacci(num);
},[42]));
console.timeEnd('separate thread calculation');
console.log('Ok, phew, we\'re done!');
console.log('You can see that this time we didn\'t block the main thread or any user actions.');
},10000);
setTimeout(async _ => {
console.log('Lets work out the 42nd number in fibonacci on a persistent, seperate thread!');
console.time('persistent thread calculation');
const thread = Bifur.persist((num) => {
// Generate a state if one doesn't exist.
if(!this.state) {
this.state = {};
}
// If we've already worked this out and saved it in the state then return the previous result.
if(!!this.state[num]) {
return this.state[num];
}
let fibonacci = (num) => {
if (num <= 1) return 1;
return fibonacci(num - 1) + fibonacci(num - 2);
}
const result = fibonacci(num);
// Persist the result in the thread's state.
this.state[num] = result;
return result;
});
console.log(await thread.run([42]));
console.timeEnd('persistent thread calculation');
console.log('Ok, phew, we\'re done!');
console.log('You can see that this time we didn\'t block the main thread or any user actions.');
console.log('Lets run it again and see if the previous result persisted and is now returned...');
console.time('persistent thread calculation');
console.log(await thread.run([42]));
console.timeEnd('persistent thread calculation');
console.log('It is! Lovely.');
},15000);
</script>
</body>
</html>