jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.

jsperf.com URLs are mirrored at the same path, e.g:

https://jsperf.com/negative-modulo/2

Can be accessed at:

https://jsperf.app/negative-modulo/2

Web Worker JSON vs String (v4)

Revision 4 of this benchmark created by fafsdfssad on January 31, 2014

Description

Comparing the run times of web workers when passing a JSON object vs passing a string that must be parsed in order to be worked with, and now also compared to using transferable object.

Setup

var passCode = "self.onmessage = function (e){ var json = e.data; postMessage('done') };";
    
    var parseCode = "self.onmessage = function (e){ var json = JSON.parse(e.data); postMessage('done') }";
    
    var parseBlob = new Blob([parseCode], {
      type: 'text/javascript'
    });
    
    var passBlob = new Blob([passCode], {
      type: 'text/javascript'
    });
    var parseWorker = new Worker(window.URL.createObjectURL(parseBlob));
    var passWorker = new Worker(window.URL.createObjectURL(passBlob));
    
    var object = {
      "left": 0,
      "top": 0,
      "width": 400,
      "height": 400,
      "borderLeft": 0,
      "borderTop": 0,
      "borderWidth": 400,
      "borderHeight": 400,
      "contentLeft": 0,
      "contentTop": 0,
      "contentWidth": 400,
      "contentHeight": 400,
      "paddingLeft": 0,
      "paddingTop": 0,
      "paddingWidth": 400,
      "paddingHeight": 400,
      "items": [
        {
          "left": 0,
          "top": 0,
          "width": 400,
          "height": 400,
          "borderLeft": 0,
          "borderTop": 0,
          "borderWidth": 400,
          "borderHeight": 400,
          "contentLeft": 0,
          "contentTop": 0,
          "contentWidth": 400,
          "contentHeight": 400,
          "paddingLeft": 0,
          "paddingTop": 0,
          "paddingWidth": 400,
          "paddingHeight": 400,
          "items": [
            {
              "left": 0,
              "top": 0,
              "width": 100,
              "height": 300,
              "borderLeft": 0,
              "borderTop": 0,
              "borderWidth": 100,
              "borderHeight": 300,
              "contentLeft": 0,
              "contentTop": 0,
              "contentWidth": 100,
              "contentHeight": 300,
              "paddingLeft": 0,
              "paddingTop": 0,
              "paddingWidth": 100,
              "paddingHeight": 300
            },
            {
              "left": 100,
              "top": 0,
              "width": 33.333333333333336,
              "height": 300,
              "borderLeft": 100,
              "borderTop": 0,
              "borderWidth": 33.333333333333336,
              "borderHeight": 300,
              "contentLeft": 100,
              "contentTop": 0,
              "contentWidth": 33.333333333333336,
              "contentHeight": 300,
              "paddingLeft": 100,
              "paddingTop": 0,
              "paddingWidth": 33.333333333333336,
              "paddingHeight": 300
            },
            {
              "left": 133.33333333333334,
              "top": 0,
              "width": 66.66666666666667,
              "height": 400,
              "borderLeft": 133.33333333333334,
              "borderTop": 0,
              "borderWidth": 66.66666666666667,
              "borderHeight": 400,
              "contentLeft": 133.33333333333334,
              "contentTop": 0,
              "contentWidth": 66.66666666666667,
              "contentHeight": 400,
              "paddingLeft": 133.33333333333334,
              "paddingTop": 0,
              "paddingWidth": 66.66666666666667,
              "paddingHeight": 400,
              "items": [
                {
                  "left": 0,
                  "top": 0,
                  "width": 66.66666666666667,
                  "height": 400,
                  "borderLeft": 0,
                  "borderTop": 0,
                  "borderWidth": 66.66666666666667,
                  "borderHeight": 400,
                  "contentLeft": 0,
                  "contentTop": 0,
                  "contentWidth": 66.66666666666667,
                  "contentHeight": 400,
                  "paddingLeft": 0,
                  "paddingTop": 0,
                  "paddingWidth": 66.66666666666667,
                  "paddingHeight": 400
                }
              ]
            },
            {
              "left": 200,
              "top": 0,
              "width": 200,
              "height": 200,
              "borderLeft": 200,
              "borderTop": 0,
              "borderWidth": 200,
              "borderHeight": 200,
              "contentLeft": 200,
              "contentTop": 0,
              "contentWidth": 200,
              "contentHeight": 200,
              "paddingLeft": 200,
              "paddingTop": 0,
              "paddingWidth": 200,
              "paddingHeight": 200,
              "items": [
                {
                  "left": 0,
                  "top": 0,
                  "width": 50,
                  "height": 150,
                  "borderLeft": 0,
                  "borderTop": 0,
                  "borderWidth": 50,
                  "borderHeight": 150,
                  "contentLeft": 0,
                  "contentTop": 0,
                  "contentWidth": 50,
                  "contentHeight": 150,
                  "paddingLeft": 0,
                  "paddingTop": 0,
                  "paddingWidth": 50,
                  "paddingHeight": 150
                },
                {
                  "left": 50,
                  "top": 0,
                  "width": 16.666666666666668,
                  "height": 150,
                  "borderLeft": 50,
                  "borderTop": 0,
                  "borderWidth": 16.666666666666668,
                  "borderHeight": 150,
                  "contentLeft": 50,
                  "contentTop": 0,
                  "contentWidth": 16.666666666666668,
                  "contentHeight": 150,
                  "paddingLeft": 50,
                  "paddingTop": 0,
                  "paddingWidth": 16.666666666666668,
                  "paddingHeight": 150
                },
                {
                  "left": 66.66666666666667,
                  "top": 0,
                  "width": 33.333333333333336,
                  "height": 200,
                  "borderLeft": 66.66666666666667,
                  "borderTop": 0,
                  "borderWidth": 33.333333333333336,
                  "borderHeight": 200,
                  "contentLeft": 66.66666666666667,
                  "contentTop": 0,
                  "contentWidth": 33.333333333333336,
                  "contentHeight": 200,
                  "paddingLeft": 66.66666666666667,
                  "paddingTop": 0,
                  "paddingWidth": 33.333333333333336,
                  "paddingHeight": 200,
                  "items": [
                    {
                      "left": 0,
                      "top": 0,
                      "width": 33.333333333333336,
                      "height": 200,
                      "borderLeft": 0,
                      "borderTop": 0,
                      "borderWidth": 33.333333333333336,
                      "borderHeight": 200,
                      "contentLeft": 0,
                      "contentTop": 0,
                      "contentWidth": 33.333333333333336,
                      "contentHeight": 200,
                      "paddingLeft": 0,
                      "paddingTop": 0,
                      "paddingWidth": 33.333333333333336,
                      "paddingHeight": 200
                    }
                  ]
                },
                {
                  "left": 100,
                  "top": 0,
                  "width": 100,
                  "height": 100,
                  "borderLeft": 100,
                  "borderTop": 0,
                  "borderWidth": 100,
                  "borderHeight": 100,
                  "contentLeft": 100,
                  "contentTop": 0,
                  "contentWidth": 100,
                  "contentHeight": 100,
                  "paddingLeft": 100,
                  "paddingTop": 0,
                  "paddingWidth": 100,
                  "paddingHeight": 100
                }
              ]
            }
          ]
        }
      ]
    };
    
    var shortObject = var object = {
          "a": 0,
          "b": 0,
          "c": 400,
          "d": 400,
          "e": 0,
          "f": 0,
          "g": 400,
          "h": 400,
          "i": 0,
          "j": 0,
          "k": 400,
          "l": 400,
          "m": 0,
          "n": 0,
          "o": 400,
          "p": 400,
          "items": [
            {
              "a": 0,
              "b": 0,
              "c": 400,
              "d": 400,
              "e": 0,
              "f": 0,
              "g": 400,
              "h": 400,
              "i": 0,
              "j": 0,
              "k": 400,
              "l": 400,
              "m": 0,
              "n": 0,
              "o": 400,
              "p": 400,
              "items": [
                {
                  "a": 0,
                  "b": 0,
                  "c": 100,
                  "d": 300,
                  "e": 0,
                  "f": 0,
                  "g": 100,
                  "h": 300,
                  "i": 0,
                  "j": 0,
                  "k": 100,
                  "l": 300,
                  "m": 0,
                  "n": 0,
                  "o": 100,
                  "p": 300
                },
                {
                  "a": 100,
                  "b": 0,
                  "c": 33.333333333333336,
                  "d": 300,
                  "e": 100,
                  "f": 0,
                  "g": 33.333333333333336,
                  "h": 300,
                  "i": 100,
                  "j": 0,
                  "k": 33.333333333333336,
                  "l": 300,
                  "m": 100,
                  "n": 0,
                  "o": 33.333333333333336,
                  "p": 300
                },
                {
                  "a": 133.33333333333334,
                  "b": 0,
                  "c": 66.66666666666667,
                  "d": 400,
                  "e": 133.33333333333334,
                  "f": 0,
                  "g": 66.66666666666667,
                  "h": 400,
                  "i": 133.33333333333334,
                  "j": 0,
                  "k": 66.66666666666667,
                  "l": 400,
                  "m": 133.33333333333334,
                  "n": 0,
                  "o": 66.66666666666667,
                  "p": 400,
                  "items": [
                    {
                      "a": 0,
                      "b": 0,
                      "c": 66.66666666666667,
                      "d": 400,
                      "e": 0,
                      "f": 0,
                      "g": 66.66666666666667,
                      "h": 400,
                      "i": 0,
                      "j": 0,
                      "k": 66.66666666666667,
                      "l": 400,
                      "m": 0,
                      "n": 0,
                      "o": 66.66666666666667,
                      "p": 400
                    }
                  ]
                },
                {
                  "a": 200,
                  "b": 0,
                  "c": 200,
                  "d": 200,
                  "e": 200,
                  "f": 0,
                  "g": 200,
                  "h": 200,
                  "i": 200,
                  "j": 0,
                  "k": 200,
                  "l": 200,
                  "m": 200,
                  "n": 0,
                  "o": 200,
                  "p": 200,
                  "items": [
                    {
                      "a": 0,
                      "b": 0,
                      "c": 50,
                      "d": 150,
                      "e": 0,
                      "f": 0,
                      "g": 50,
                      "h": 150,
                      "i": 0,
                      "j": 0,
                      "k": 50,
                      "l": 150,
                      "m": 0,
                      "n": 0,
                      "o": 50,
                      "p": 150
                    },
                    {
                      "a": 50,
                      "b": 0,
                      "c": 16.666666666666668,
                      "d": 150,
                      "e": 50,
                      "f": 0,
                      "g": 16.666666666666668,
                      "h": 150,
                      "i": 50,
                      "j": 0,
                      "k": 16.666666666666668,
                      "l": 150,
                      "m": 50,
                      "n": 0,
                      "o": 16.666666666666668,
                      "p": 150
                    },
                    {
                      "a": 66.66666666666667,
                      "b": 0,
                      "c": 33.333333333333336,
                      "d": 200,
                      "e": 66.66666666666667,
                      "f": 0,
                      "g": 33.333333333333336,
                      "h": 200,
                      "i": 66.66666666666667,
                      "j": 0,
                      "k": 33.333333333333336,
                      "l": 200,
                      "m": 66.66666666666667,
                      "n": 0,
                      "o": 33.333333333333336,
                      "p": 200,
                      "items": [
                        {
                          "a": 0,
                          "b": 0,
                          "c": 33.333333333333336,
                          "d": 200,
                          "e": 0,
                          "f": 0,
                          "g": 33.333333333333336,
                          "h": 200,
                          "i": 0,
                          "j": 0,
                          "k": 33.333333333333336,
                          "l": 200,
                          "m": 0,
                          "n": 0,
                          "o": 33.333333333333336,
                          "p": 200
                        }
                      ]
                    },
                    {
                      "a": 100,
                      "b": 0,
                      "c": 100,
                      "d": 100,
                      "e": 100,
                      "f": 0,
                      "g": 100,
                      "h": 100,
                      "i": 100,
                      "j": 0,
                      "k": 100,
                      "l": 100,
                      "m": 100,
                      "n": 0,
                      "o": 100,
                      "p": 100
                    }
                  ]
                }
              ]
            }
          ]
        };
      };

Teardown


    parseWorker.terminate();
    passWorker.terminate();

Test runner

Ready to run.

Testing in
Test		Ops/sec
Pass JSON	`// async test passWorker.onmessage = function(){ deferred.resolve(); }; passWorker.postMessage(object);`	ready
Pass String	`// async test parseWorker.onmessage = function(){ deferred.resolve(); }; parseWorker.postMessage(JSON.stringify(object));`	ready
Pass JSON Short	`passWorker.onmessage = function(){ deferred.resolve(); }; passWorker.postMessage(shortObject);`	ready
Pass String Short	`parseWorker.onmessage = function(){ deferred.resolve(); }; parseWorker.postMessage(JSON.stringify(shortObject));`	ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

Revision 1: published by lexander on November 20, 2013
Revision 2: published by lexander on November 21, 2013
Revision 3: published by bracket on December 1, 2013
Revision 4: published by fafsdfssad on January 31, 2014
Revision 5: published on February 1, 2014