Does Javascript Custom Event have limited size?

Question

Does custom event have limited size?

I'm doing custom event like this example from the MDN Web doc :

    // add an appropriate event listener
    obj.addEventListener("myEvent", (e) => {
        // ...
    });
    
    // create and dispatch the event
    var event = new CustomEvent("myEvent", {
      detail: {
        myPayload: {}   // ---> Does payload here has limited size?
      }
    });
    obj.dispatchEvent(event);

Answer 1

Event payload is just a plain JavaScript object, so it's size is limited by object limited size.

In JavaScript, data can auto expand the size to fit it value, and it can expand to the point that your client's memory is run out, which mean as long as your client have enough memory, you can put everything inside your event payload.

Answer 2

There is an upper bound that is the same as the total memory allocated to a browser.

You can check the total allocated heap memory allocation to a browser window.performance.memory.jsHeapSizeLimit in the browser console. If you wish to exhaust your browser's total allocated memory, run following in your console(Tested with 16GB RAM on MacBook Pro 13 inch 2020 version on Google Chrome 84.0.4147.105 (Official Build) (64-bit) ).

const myArr = [];
for(let i = 0; i < 99999999999999999999999; i++){
  myArr.push(Math.random())
}
myArr.sort()
console.log(myArr)

You'll get something like the following:

Talking about chrome, by default v8 has a memory limit of 512MB on 32-bit systems, and 1.4GB on 64-bit systems. The limit can be raised by setting --max_old_space_size to a maximum of 1024 (1 GB) on 32-bit and 4096 (4GB) on 64-bit.

So in majority scenarios you are safe to run the code until unless you blow your memory stack.