Converting JS object to ArrayBuffer to transfer to/from web worker equals bottleneck

Question

I have a web worker which is constantly calculating big amounts of data which when finished a round is a js object which I then parse to an ArrayBuffer, and then send it to the main thread.

Can't do much about the calculation and the transfer of the ArrayBuffer is quick. But the parsing of this object is however slowing down the process. As the object itself contains arrays of more objects.

In Firefox I get the following warning:

A script on this page may be busy, or it may have stopped responding.
You can stop the script now, open the script in the debugger,
or let the script continue.

Script: http://localhost/js/util/DataViewSerializer.js:435

Line 435 refers to a function where I serialise an Array. That line is where the for loop is declared.

DataViewSerializer.prototype.setArray = function (array, serializer) {
    var i,
        l = JSUtil.hasValue(array) ? array.length : 0;

    this.setUint32(l);

    console.log(array, serializer);
    for (i = 0; i < l; i += 1) {
        if (serializer !== undefined) {
            serializer.serializeTo(array[i], this);
        } else {
            array[i].serializeTo(this);
        }
    }
};

I'm reading about Transferable Object between web worker and main thread. As sending ArrayBuffers seems to be the only way.

So my question is if there are speedier ways to convert a js object to and ArrayBuffer? Or any other suggestions to speed this up?

Can you use an `ArrayBuffer` instead of an `Array` throughout and then you may only need to convert it once? — Xotic750, Sep 13 '16 at 07:36
Might be a last resort as I would need to rewrite a lot of code. And it would be harder to debug or keep track of it I think. — just_user, Sep 13 '16 at 08:02

score -11 · Answer 1 · edited Aug 28 '18 at 20:12

Questions of this character have been asked like 3 times in web workers already. Those are two that I answered with pretty long answers:

Given I've already written lot of text, I'll just repeat the main theme:

Do not use custom serialization in favor of Structured clone algorithm unless your data aren't supported by Structured clone algorithm!

That is, just call:

worker.postMessage({name: "MY_MESSAGE", data:myArray});

Converting JS object to ArrayBuffer to transfer to/from web worker equals bottleneck

1 Answers1