dom/plain: string vs symbol vs weakmap vs attribute vs dataset

JavaScript performance comparison

Test case created by LongTengDao

Preparation code


      
      <script>
Benchmark.prototype.setup = function() {
  dom = document.createElement('div');
  __null__ = Object.create(null);
  __Null__ = Object.create(Object.create(null));
  __create__ = Object.create(Object.prototype);
  __new__ = new function () {};
  plain = {};
  array = [];
  pub = new class {
    #one
    #two
    #three
    run(){
      pub.#one = 'something';
      pub.#two = 'something';
      pub.#three = 'something';
      pub.#one;
      pub.#two;
      pub.#three;
    }
  };
  pri = pub.run;
  int1 = 0;
  int2 = 1;
  int3 = 2;
  str1 = '0';
  str2 = '1';
  str3 = '2';
  varOne = 'one';
  varTwo = 'two';
  varThree = 'three';
  one = Symbol('one');
  two = Symbol('two');
  three = Symbol('three');
  ONE_ = new WeakMap;
  TWO_ = new WeakMap;
  THREE_ = new WeakMap;
  ONE = new WeakMap;
  TWO = new WeakMap;
  THREE = new WeakMap;

};
</script>

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
plain[number]
'use strict';
{
plain[0] = 'somestring';
plain[1] = 'somestring';
plain[2] = 'somestring';
plain[0];
plain[1];
plain[2];
}
pending…
dom.attribute
'use strict';
{
dom.setAttribute('data-one','somestring');
dom.setAttribute('data-two','somestring');
dom.setAttribute('data-three','somestring');
dom.getAttribute('data-one');
dom.getAttribute('data-two');
dom.getAttribute('data-three');
}
pending…
plain[number_string]
'use strict';
{
plain['0'] = 'somestring';
plain['1'] = 'somestring';
plain['2'] = 'somestring';
plain['0'];
plain['1'];
plain['2'];
}
pending…
plain[number_string_variable]
'use strict';
{
plain[str1] = 'somestring';
plain[str2] = 'somestring';
plain[str3] = 'somestring';
plain[str1];
plain[str2];
plain[str3];
}
pending…
plain.bare
'use strict';
{
plain.one = 'somestring';
plain.two = 'somestring';
plain.three = 'somestring';
plain.one;
plain.two;
plain.three;
}
pending…
dom.bare
'use strict';
{
dom.one = 'somestring';
dom.two = 'somestring';
dom.three = 'somestring';
dom.one;
dom.two;
dom.three;
}
pending…
plain[number_variable]
'use strict';
{
plain[int1] = 'somestring';
plain[int2] = 'somestring';
plain[int3] = 'somestring';
plain[int1];
plain[int2];
plain[int3];
}
pending…
dom[symbol]
'use strict';
{
dom[one] = 'somestring';
dom[two] = 'somestring';
dom[three] = 'somestring';
dom[one];
dom[two];
dom[three];
}
pending…
weakmap(dom)
'use strict';
{
ONE_.set(dom,'somestring');
TWO_.set(dom,'somestring');
THREE_.set(dom,'somestring');
ONE_.get(dom);
TWO_.get(dom);
THREE_.get(dom);
}
pending…
dom.dataset.bare
'use strict';
{
const dataset = dom.dataset;
dataset.one = 'somestring';
dataset.two = 'somestring';
dataset.three = 'somestring';
dataset.one;
dataset.two;
dataset.three;
}
pending…
map(dom)
'use strict';
{
ONE.set(dom,'somestring');
TWO.set(dom,'somestring');
THREE.set(dom,'somestring');
ONE.get(dom);
TWO.get(dom);
THREE.get(dom);
}
pending…
plain[string]
'use strict';
{
plain['one'] = 'somestring';
plain['two'] = 'somestring';
plain['three'] = 'somestring';
plain['one'];
plain['two'];
plain['three'];
}
pending…
plain[bare_variable]
'use strict';
{
plain[varOne] = 'somestring';
plain[varTwo] = 'somestring';
plain[varThree] = 'somestring';
plain[varOne];
plain[varTwo];
plain[varThree];
}
pending…
plain[hash]
'use strict';
{
plain['#one'] = 'somestring';
plain['#two'] = 'somestring';
plain['#three'] = 'somestring';
plain['#one'];
plain['#two'];
plain['#three'];
}
pending…
array[number]
'use strict';
{
array[0] = 'somestring';
array[1] = 'somestring';
array[2] = 'somestring';
array[0];
array[1];
array[2];
}
pending…
instance.#private
'use strict';
pri();
pending…
__null__.bare
'use strict';
{
__null__.one = 'somestring';
__null__.two = 'somestring';
__null__.three = 'somestring';
__null__.one;
__null__.two;
__null__.three;
}
pending…
__create__.bare
'use strict';
{
__create__.one = 'somestring';
__create__.two = 'somestring';
__create__.three = 'somestring';
__create__.one;
__create__.two;
__create__.three;
}
pending…
__Null__.bare
'use strict';
{
__Null__.one = 'somestring';
__Null__.two = 'somestring';
__Null__.three = 'somestring';
__Null__.one;
__Null__.two;
__Null__.three;
}
pending…
__new__.bare
'use strict';
{
__new__.one = 'somestring';
__new__.two = 'somestring';
__new__.three = 'somestring';
__new__.one;
__new__.two;
__new__.three;
}
pending…

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

Compare results of other browsers

0 Comments