Aurelia and Web workers


#1

Hello everybody

Does anyone know how to use Aurelia and Web workers together? Any docs?


#2

Yes, I did it in a few applications, like this one http://ashware.nl/fast-life/
All you have to do is simply declare the worker: like
this.wrkr = new Worker('./assets/life-worker.js');
I built a service that communicates with the worker in this application.
https://github.com/Esger/Fast-Life-Aurelia-JS
The worker has to be written in Vanilla JS.


#3

There is nothing against using worker inside au app.
To ease my setup, I am using cli+requirejs to help me bundle a worker.js like this:

Just use prepend without source and dependencies. You just need to make sure all libs you use in your worker support global names without using any module loader.

{
  "name": "app-bundle.js",
  // ...
}
{
    "name": "validation-worker.js",
    "prepend": [
      "node_modules/lodash/lodash.min.js",
      "node_modules/bcx-expression-evaluator/dist/index.js",
      "node_modules/bcx-validation/dist/index.js",
      "node_modules/bcx-blueprint-lib/dist/index.js",
      "scripts/validation-worker.js"
    ]
 },
{
  "name": "vendor-bundle.js",
  // ...
}

#4

I was also wondering how I could use the Aurelia bundler to created a worker bundle. In my worker I want to re-use the models and API clients.
Using prepend is not a good choice because the scripts are not compiled to es5. I also tried to use source in my bundle but it only includes the file in one bundle o.O
Is there any way I can tell the bundler to resolve all imports and include them in the bundle even though they are included already in another bundle?


#5

I am afraid you cannot ask cli to bundle same lib into two bundle files. The implementation of cli guarantee there is no duplicated module (otherwise requirejs will be confused).

The way I use cli bundle is a hack. prepend are not modules, so cli will add them blindly. The cli bundle was not designed to support web worker, but I hijack prepend to support it.

Of course, my vendor-bundle still got those duplicated modules bcx-validation/bcx-blueprint-lib/lodash/bcx-expression-evaluator in dependencies section.

The only reason my code still works in worker without requirejs, is that all my libs are compiled by Rollup in UMD format (to support global variable when requirejs is not present).

Here is my scripts/validation-worker.js, you can see I use my bcx-blueprint-lib through the global name space.

/* global BcxBlueprintLib, self */

var BlueprintDataEngine = BcxBlueprintLib.BlueprintDataEngine;
var Typing = BcxBlueprintLib.Typing;

var typing;

self.addEventListener('message', function(e) {
  var data = e.data;

  if (data.nodeTypes && data.relationshipTypes) {
    typing = new Typing(data.nodeTypes, data.relationshipTypes);
  } else {
    var mutationCounter = data.mutationCounter;
    var engine = new BlueprintDataEngine(typing, data.blueprintData, data.blueprintProperties);
    postMessage({
      mutationCounter: mutationCounter,
      errors: engine.errors
    });
  }
});

#6

If you can DRY your share code into a lib, then you would not have es5 compilation issue.


#7

Sounds like ugly workarounds^^

Maybe this could be added as feature to the cli project so that an option can be specified to duplicate things. Another option would be to modify the bundle task and add a custom bundler to just transpile the es6 to commonjs es5 and bundle it based on the config in aurelia.json.