WebWorkers inline script

by replicateur

HTML

<input id="start" type="button" value="Start" />
<input id="max" type="text" value="100" placeholder="What is your computing limit?" />

<div id="status">Preparing worker...</div>
<script type="javascript/worker">
	postMessage('Worker is ready...');
	var max = 100;
	function getPrimes(max) {
		var timer0 = Date.now();
		var count = 0;
		var sieve = [], i, j;
		for (i = 2; i <= max; ++i) {
			if (!sieve[i]) {
				count++;
				postMessage('Found ' + count + ' primes over ' + max + ' numbers.');
				for (j = i << 1; j <= max; j += i) {
					sieve[j] = true;
				}
			}
		}
		var timer1 = Date.now();
		return {'count': count, 'time': (timer1 - timer0)};
	}

	onmessage = function(e) {
		if (e.data && e.data.trigger === 'start') {
			var t = getPrimes(e.data.args.max);
			postMessage('Done in ' + t.time + 'ms! Got ' + t.count + ' primes over ' + e.data.args.max + ' numbers.');
		}
	};
</script>

JavaScript

function getInlineJS() {
  var js = document.querySelector('[type="javascript/worker"]').textContent;
  var blob = new Blob([js], {
    "type": "text\/plain"
  });
  return URL.createObjectURL(blob);
}
var ww = new Worker(getInlineJS());
ww.onmessage = function(e) {
  var msg = e.data;
  document.getElementById('status').innerHTML = msg;
  if (msg === 'Done!') alert('Next');
};

document.getElementById('start').addEventListener('click', start, false);
function start() {
  ww.postMessage({
    'trigger': 'start',
    'args': {
      'max': document.getElementById('max').value,
    }
  });
}