Use Webworkers with H5P

Submitted by mnowakow on Tue, 02/02/2021 - 19:05
Forums: 
Content creation

Hi everyone!

I recently started to get into H5P to realize some tasks concerning music notation. I would like to use an external library which uses lots of convenient, but very compute intensive functions. To be as performant as possible I tried to use Webworkers to outsource most of computing with this library. But as far as I understand webworkers always need some kind of URL in their constructor to work, which means that I need to use at least 2 (bundeled) js-Files for the project to refer from one to another. e.g new Worker("./worker.js")

I am using the webpack method to develop for H5P which makes organizing pretty easy, but nevertheless the worker has to be in a second file.

Is there any experience with webworkers in h5p?

Or can I import both files and make them refer to one another in the library.json?

Thanks in advance,

Matthias

Firejunkie

Wed, 05/26/2021 - 18:13

Hi Matthias,

I had the same problems with Webworkers and i found some Solutions that worked by avoiding the use of a seperate js file.

Hope this link helps you too: https://stackoverflow.com/questions/5408406/web-workers-without-a-separa...

Here the Solution I Tryed and that worked pretty well.

   // Build a worker from an anonymous function body
    var blobURL = URL.createObjectURL(new Blob(['(',
      function () {
        //Long-running work here
        self.onmessage = function(event) {
          //Some work
          //...
          self.postMessage(result);
        };
      }.toString(),
      ')()'], { type: 'application/javascript' })),
      worker = new Worker(blobURL);
      worker.onmessage = function (e) {
        console.log(e.data);
      }
      // Start the worker.
      worker.postMessage("hello");

I hope i could help you a bit

Cheers

Yannik