Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
An example of using simple inline Web Workers with a fallback for browsers that can't support this technique.
<!DOCTYPE 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
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
See the License for the specific language governing permissions and
limitations under the License.
<script type="javascript/worker">
self['onmessage'] = function(event) {
postMessage('Hello, ' + + '!');
* 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 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(;
function runWorkerJs(js, params, callback) {
var BlobBuilder = (window.BlobBuilder || window.WebKitBlobBuilder);
var URL = (window.URL || window.webkitURL);
var Worker = window.Worker;
if (URL && BlobBuilder && Worker) {
// BlobBuilder, Worker, and window.URL.createObjectURL are all available,
// so we can use inline workers.
var bb = new BlobBuilder();
var worker = new Worker(URL.createObjectURL(bb.getBlob()));
worker.onmessage = function(event) {
} 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) {
// 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
data: params
{ name: 'Bob' },
function(result) {
document.body.innerHTML = result;
Copy link

joemccann commented Nov 12, 2011

Brilliant. Was just what I was looking for.

Copy link

nigilan commented Jun 13, 2012

nice one .. tnx

Copy link

Fil commented Apr 11, 2015

Thanks. I forked it to use Blob instead of BlobBuilder:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment