nygma-web-workers v1.0.21

nygma-web-workers

export function task(data: number, {progress, cancelled, done}: WorkerHelpers) {
  progress(0);
  let value = 0;
  for (var i = 2, len = data / 2 + 1; i < len; i++) {
    if(i / len - value > 0.01) {
      value = i / len;
      progress(value);

      if(cancelled()) {
        return;
      }
    }
    if (data % i === 0) {
      progress(1);
      done(false);
    }
  }
  progress(1);
  done(true);
}

export function timer(data: number, {done, next, cancelled}: WorkerHelpers) {
  next('timer set to ' + data + 'ms');

  let interval = setInterval(() => {
    data -= 1000;
    next(data + 'ms left');

    if(data <= 0) {
      clearInterval(interval);
      next('time is up');
      done();
    }
    if(cancelled()) {
      clearInterval(interval);
      next('timer cancelled');
    }
  }, 1000);
}

let worker: WebWorker = new InlineWorker(task);

let promise = this.worker.progress((value) => console.log(value)).run(1234567890);
await Promise.all([worker])

What else? How about the use of webpack chunks as workers instead? Sounds promising. In fine we will have the worker that can be async, can import functionality from other modules, can contain class definitions and use object instances. Obviously we can benefit from having control over bundling process. Potentially we can remove sensitive information from the module and inject it right before the execution, if it weren't the ability to view the content of the blobs in the browser. So let me introduce my own worker type: ModuleWorker.

let worker: WebWorker = new ModuleWorker('./webworker.js', 'timer');

let promise = this.worker.progress((value) => console.log(value)).run(10000);
await Promise.all([worker])

const path = require('path');

module.exports = {
  mode: 'production',
  optimization: {
    usedExports: false,
  },
  entry: {
    webworker: './projects/app/src/webworker.ts',
  },

  output: {
    path: path.resolve(__dirname, 'dist'),
  },
  resolve: {
    extensions: ['.js', '.ts']
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      }
    ]
  },
  devServer: {
    static: './dist'
  }
};