Require.JS plugin to simplify Web Workers management.
requirejs-worker
is a Work In Progress, some features are already availables but a lot of tests and improvements needs to be done.
- Load module in a Web Worker proxy
- Provide module proxy methods in DOM context
- Test on Chrome, Firefox, Edge, IE 10 (with Promise polyfill)
- Test on Opera, Safari, mobiles...
- Allow multiple Workers
- Create Workers from Web Worker
- Allow SharedWorker ?
- Create a Proxy when Web Workers are not availables
- Optimize performances
- Optimize almonds builds
npm install requirejs-worker --save
bower install requirejs-worker --save
Simply clone the repository or download the last release.
Configure paths
in your requirejs
configuration:
requirejs.config({
paths: {
worker: "path/to/workerlib/worker"
},
worker: {
// requirejs-worker options goes here.
debug: true
}
});
- path: (Optional) URL of the worker. Default:
webworker.js
- debug: (Optional) Output debug informations to console. Default:
false
- stack: (Optional) Send error stacks from Web Worker. Default:
false
Create a webworker.js
bootstrapper file in the same directory as your main
file with the following content:
importScripts("path/to/requirejs/require.js");
requirejs.config({
paths: {
worker: "path/to/workerlib/worker"
// Add your config here
}
});
require(["worker/proxy"], function(proxy) {
onmessage = proxy.onmessage;
proxy.init();
});
calc.js
define({
add: function (a, b) {
return a + b;
},
sub: function (a, b) {
return a - b;
},
mul: function (a, b) {
return a * b;
},
div: function (a, b) {
return a / b;
}
});
define(["worker!calc"], function (calc) {
});
Every methods are proxied using Promises
.
define(["worker!calc"], function (calc) {
calc.add(2, 3)
.then(function(result) { console.log(result === 5); })
.catch(function(error) { console.error(error); });
});
requirejs-worker
includes a plugin builder which:
- append modules in base file in case of fallback
- create a
webworker.js
file alongside to theout
file which contains every workers modules.
To enable web worker building, you need to include require.js
in your resulting build:
build.js
({
name: "requirejs",
baseUrl: "tests",
out: "dist/main.js",
paths: {
requirejs: "path/to/requirejs/require",
worker: "path/to/workerlib/worker"
},
worker: {
// requirejs-worker config goes here
path: "worker.js"
},
include: ["main"],
insertRequire: ["main"],
wrap: true
})
requirejs-worker
will automatically adapt the configuration to generate the webworker.js
file.
- path: (Optional) URL of the destination worker file. Default:
webworker.js
- overrides: (Optional) Configuration overrides for Web worker optimization. Default:
{}
- fallbacks: (Optional) Output modules in both files in case of no Web Worker support. Default:
true
- output: (Optional) Set to
false
to disable destionation worker file creation. Default:true
almond is an tiny implementation of the Require.JS API for use in built files. It drastically reduces the size of the package by dropping the asynchronous feature of Require.JS.
requirejs-worker
include a hack to work with almond.
However, to generate module proxies in sync, it need to load the module in both environments (DOM + Web Worker). This has a major performance impact.
Waiting for a better workaround, we strongly encourage to not use requirejs-worker
with almond