This project compares and contrasts two ES6 object creation models:
// functional aka "classless" or broadly "factory"
const createFoo = (spec) => {
const { value } = spec;
return {
add: (number) => number + value
};
};
const foo = createFoo({ value: 42 });
foo.add(1); // => 43// "pseudoclassical" or broadly "prototypal"
const Foo = class {
constructor (value) {
this._value = value;
}
add (number) {
return number + this._value;
}
};
const foo = new Foo(42);
foo.add(1); // => 43The functional style (createFoo) offers considerable advantages around code structure and stability. The pseudoclassical style (new Foo()) has been reported to offer performance advantages. How do these two styles of object creation stack up against each other in practice?
This project aims to answer the question with a small (but realistic) graph manipulation library.
# install dependencies
npm install
# run tests
npm test
# run benchmarks
node --require reify benchmark/graph-creation.js
node --require reify benchmark/graph-traversal.js# start server, required for ES modules in browser
npm run serve
# browse to localhost:8080/html/classless.html
# browse to localhost:8080/html/classy.html