My very first web worker
by Pavel Kityan
HTML
<p><button>Post message</button></p>
<script type="text/ww">
var tms = []
var repeats = 10;
function slowCalc() {
var arr = [];
for(var i = 0; i < 15000000; i++){ arr[i] = Math.random() };
};
function calc(e) {
if(e.data.action == "single") {
self.postMessage({action: "single", a:2, b:3});
} else if (e.data.action == "full") {
var current = 0;
function iterate() {
slowCalc();
self.postMessage({action: "full", results: 1234567, iteration: current});
current++;
if (current <= repeats) {
tms.push(setTimeout(iterate, 0));
}
};
tms.push(setTimeout(iterate, 100));
}
}
self.onmessage = function(e) {
tms.forEach(function(tm){clearTimeout(tm);});
var _time = Date.now();
tms.push(setTimeout(function(){calc(e);}, 0));
//console.log(e.data.action +" - "+ (Date.now() -_time) + 'ms');
};
</script>
JavaScript
var ww = document.querySelector('script[type="text/ww"]'),
code = ww.textContent,
blob = new Blob([code], {type: 'text/javascript'}),
blobUrl = URL.createObjectURL(blob),
worker = new Worker(blobUrl);
worker.onmessage = function(e) {
console.log(e.data);
};
document.querySelector('button').addEventListener('mousedown', function(e) {
worker.postMessage({action: 'single'});
});
document.querySelector('button').addEventListener('mouseup', function(e) {
worker.postMessage({action: 'full'});
});