Last active
May 20, 2021 17:20
-
-
Save DerekZiemba/5c4e4ed52ce564de7d07231f9e44d687 to your computer and use it in GitHub Desktop.
Object Shape: Different methods for backing fields (https://jsbench.github.io/#5c4e4ed52ce564de7d07231f9e44d687) #jsbench #jsperf
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"/> | |
<title>Object Shape: Different methods for backing fields</title> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script> | |
<script src="./suite.js"></script> | |
</head> | |
<body> | |
<h1>Open the console to view the results</h1> | |
<h2><code>cmd + alt + j</code> or <code>ctrl + alt + j</code></h2> | |
</body> | |
</html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
"use strict"; | |
(function (factory) { | |
if (typeof Benchmark !== "undefined") { | |
factory(Benchmark); | |
} else { | |
factory(require("benchmark")); | |
} | |
})(function (Benchmark) { | |
var suite = new Benchmark.Suite; | |
Benchmark.prototype.setup = function () { | |
function Closure() { | |
let _private = 1; | |
return { | |
get value() { return _private; }, | |
set value(val) { _private = val; } | |
}; | |
} | |
class Classical { | |
constructor() { this._private = 1; } | |
get value() { return this._private; } | |
set value(val) { this._private = val; } | |
} | |
class ClassicalProto { | |
get value() { return this._private; } | |
set value(val) { this._private = val; } | |
} | |
ClassicalProto.prototype._private = 1; | |
class ClassicalDefineNonEnumerable { | |
constructor() { | |
Object.defineProperty(this, '_private', { configurable: true, writable: true, enumerable: false, value: 1 }); | |
} | |
get value() { return this._private; } | |
set value(val) { this._private = val; } | |
} | |
class ClassPrivate { | |
#private = 1; | |
get value() { return this.#private; } | |
set value(val) { this.#private = val; } | |
} | |
class CtorPrivate { | |
#private; | |
constructor() { this.#private = 1; } | |
get value() { return this.#private; } | |
set value(val) { this.#private = val; } | |
} | |
const $private = Symbol.for('private'); | |
class ClassSymbol { | |
[$private] = 1; | |
get value() { return this[$private]; } | |
set value(val) { this[$private] = val; } | |
} | |
class CtorSymbol { | |
constructor() { this[$private] = 1; } | |
get value() { return this[$private]; } | |
set value(val) { this[$private] = val; } | |
} | |
class ClassProto { | |
constructor() { this[$private] = 1; } | |
get value() { return this[$private]; } | |
set value(val) { this[$private] = val; } | |
} | |
}; | |
suite.add("Closure", function () { | |
// Closure | |
var val = Closure(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.add("Classical", function () { | |
// Classical | |
/** Historically, privates were normal properties prefixed with an underscore */ | |
var val = new Classical(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.add("ClassicalProto", function () { | |
// ClassicalProto | |
/** Historically, privates were normal properties prefixed with an underscore */ | |
var val = new ClassicalProto(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.add("ClassicalDefineNonEnumerable", function () { | |
// ClassicalDefineNonEnumerable | |
/** Historically, privates were normal properties prefixed with an underscore */ | |
var val = new ClassicalDefineNonEnumerable(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.add("ClassSymbol", function () { | |
// ClassSymbol | |
var val = new ClassSymbol(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.add("CtorSymbol", function () { | |
// CtorSymbol | |
var val = new CtorSymbol(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.add("ClassPrivate", function () { | |
// ClassPrivate | |
var val = new ClassPrivate(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.add("CtorPrivate", function () { | |
// CtorPrivate | |
var val = new CtorPrivate(); | |
(val.value = val.value++ + ++val.value + ++val.value); | |
if (val.value !== 8) { throw new Error('Bad Implementation'); } | |
return val.value; | |
}); | |
suite.on("cycle", function (evt) { | |
console.log(" - " + evt.target); | |
}); | |
suite.on("complete", function (evt) { | |
console.log(new Array(30).join("-")); | |
var results = evt.currentTarget.sort(function (a, b) { | |
return b.hz - a.hz; | |
}); | |
results.forEach(function (item) { | |
console.log((idx + 1) + ". " + item); | |
}); | |
}); | |
console.log("Object Shape: Different methods for backing fields"); | |
console.log(new Array(30).join("-")); | |
suite.run(); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment