Skip to content

Instantly share code, notes, and snippets.

@Fil
Forked from romannurik/inline_worker_with_fallback.html
Last active December 19, 2020 21:15
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save Fil/eeac85f83bbc682a4f2d to your computer and use it in GitHub Desktop.
Save Fil/eeac85f83bbc682a4f2d to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<!--
Copyright 2011 Google Inc.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<body>
<script type="javascript/worker">
self['onmessage'] = function(event) {
postMessage('Hello, ' + event.data.name + '!');
};
</script>
<script>
/**
* Helper method for running inline Web Workers, if the browser can support
* them. If the browser doesn't support inline Web Workers, run the script
* on the main thread, with this function body's scope, using eval. Browsers
* must provide Blob or BlobBuilder, URL.createObjectURL, and Worker support to use
* inline Web Workers. Most features such as importScripts() are not
* currently supported, so this only works for basic workers.
* @param {String} js The inline Web Worker Javascript code to run. This code
* must use 'self' and not 'this' as the global context variable.
* @param {Object} params The parameters object to pass to the worker.
* Equivalent to calling Worker.postMessage(params);
* @param {Function} callback The callback to run when the worker calls
* postMessage. Equivalent to adding a 'message' event listener on a
* Worker object and running callback(event.data);
*/
function runWorkerJs(js, params, callback) {
var BlobBuilder = (window.BlobBuilder || window.WebKitBlobBuilder);
var Blob = window.Blob;
var URL = (window.URL || window.webkitURL);
var Worker = window.Worker;
if (URL && (Blob || BlobBuilder) && Worker) {
// Blo or BlobBuilder, Worker, and window.URL.createObjectURL are all available,
// so we can use inline workers.
if (Blob) {
var bb = new Blob([js]);
} else {
var bb = new BlobBuilder();
bb.append(js);
bb = bb.getBlob();
}
var worker = new Worker(URL.createObjectURL(bb));
worker.onmessage = function(event) {
callback(event.data);
};
worker.postMessage(params);
} else {
// We can't use inline workers, so run the worker JS on the main thread.
(function() {
var __DUMMY_OBJECT__ = {};
// Proxy to Worker.onmessage
var postMessage = function(result) {
callback(result);
};
// Bind the worker to this dummy object. The worker will run
// in this scope.
eval('var self=__DUMMY_OBJECT__;\n' + js);
// Proxy to Worker.postMessage
__DUMMY_OBJECT__.onmessage({
data: params
});
})();
}
}
runWorkerJs(
document.querySelector('[type="javascript/worker"]').textContent,
{ name: 'Bob' },
function(result) {
document.body.innerHTML = result;
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment