I would like to create a SharedWorker as described in a chapter of an excellent book: https://github.com/getify/You-Dont-Know-JS/blob/master/async%20%26%20performance/ch5.md
I was able to cook up a very good example for normal web workers:
function createAsker(limit) {
var blob = new Blob(["onmessage = function(e) { " +
"if (self.higher === undefined) self.higher = " + limit + "; " +
"if (self.lower === undefined) self.lower = 1;" +
"if (e.data === 'correct') { " +
"postMessage('Party time'); " +
"} else {" +
"if (e.data === 'greater') self.lower = parseInt((self.lower + self.higher) / 2);" +
"if (e.data === 'lower') self.higher = parseInt((self.lower + self.higher) / 2);" +
"postMessage(parseInt((self.lower + self.higher) / 2));" +
"}" +
"}"]);
var blobURL = window.URL.createObjectURL(blob);
var worker = new Worker(blobURL);
return worker;
}
var asker = createAsker(1000);
function createAnswerer(limit) {
var blob = new Blob(["onmessage = function(e) { " +
"postMessage((e.data == " + limit + ") ? 'correct' : ((e.data < " + limit + ") ? 'greater' : 'lower'));" +
"}"]);
var blobURL = window.URL.createObjectURL(blob);
var worker = new Worker(blobURL);
return worker;
}
var answerer = createAnswerer(42);
asker.onmessage = function(e) {
console.log('Asker says: ' + e.data);
if (e.data !== "Party time") {
setTimeout(function() {answerer.postMessage(e.data)}, 1000);
}
};
answerer.onmessage = function(e) {
console.log('Answerer says: ' + e.data);
setTimeout(function() {asker.postMessage(e.data)}, 1000);
};
asker.postMessage('start');
Yet, I have difficulty on creating a shared worker. I attempted to create one with this code:
function createWorker() {
var blob = new Blob(['addEventListener( "connect", function(evt){ ' +
'var port = evt.ports[0]; ' +
'port.addEventListener( "message", function(evt){' +
'port.postMessage( .. );debugger;' +
'} );' +
'port.start();' +
'} );']);
var blobURL = window.URL.createObjectURL(blob);
var w = new SharedWorker(blobURL);
return w;
}
var w = createWorker();
w.port.start();
w.port.onmessage = function(e) {
console.log(e.data);
};
w.port.onmessage('foobar');
and after sending the message of foobar I would expect my shared worker to post a message, or at least I expect to be guided into the code by the debugger, yet, when I run this code the console gives two undefined as a response.
Base64 encoding gives a permanent URL until the source code changes.
const source = 'importScripts("https://anotherhost/worker.js")';
const url = 'data:application/javascript;base64,' + btoa(source);
const worker = new SharedWorker(url);
It works at least in Chrome 73 and Firefox 66.
There is a limit to the length of the encoded URL of about 65 kilobytes.