ES6 Mixin / polyfill tool
As minimal as possible modular class mixin / polyfill utility. Size report is at the bottom of this document at the reports section, just roll down
Modularity means you can include only required to you part of this library into your application, so no dumb data will be included
What about performance. Runtime overhead is zero. Library code executes only once on application startup (normally. But you may to create classes (not instances, exactly classes) in the runtime) and looks has no place to stuck
Works fine:
static
methods and attributes- properties
- regular methods
Limitations:
- Instance attributes does not work
- Arrow function methods does not work
super
in the mixin class does not work- No magic. Just copy attributes
High-level API. Works the same as mixin
of es6-class-mixin
and mix
of mixin-es6. Look there
for more examples
Difference is in method resolve order, explaination is in example
import { mix } from "es6-mixin-nano";
OR
import mix from "es6-mixin-nano/src/mix";
class MyClass extends mix(Base, FooMixin, BarMixin, BazMixin) { /* --- */ }
MyClass => FooMixin => BarMixin => BazMixin => Base
It means if you define the same method in FooMixin
and BazMixin
, MyClass
will have FooMixin
's implementation
Mid-level API, used by mix
. injectMany
handles method resolve order and
uses injectMixin
as worker. Injects mixins into the target class in-place
import { injectMany } from "es6-mixin-nano";
OR
import injectMany from "es6-mixin-nano/src/injectMany";
injectMany(Base, FooMixin, BarMixin, BazMixin);
FooMixin => BarMixin => BazMixin => Base
Mid-level API, used by injectMany
, handles only one mixin but makes it
perfectly. Injects mixin behavior into target class in-place. Besides own
given mixin's attributes injects into target class all attributes found in
given mixin's parent classes
import { injectMixin } from "es6-mixin-nano";
OR
import injectMixin from "es6-mixin-nano/src/injectMixin";
class MapViaForOf {
map(func) {
const result = [];
const i = 0;
for (const item of this) {
const value = func(item, i);
result.push(value);
i++;
}
return result;
}
}
injectMixin(Set, MapViaForOf);
class LengthViaSize {
// Unify API
get length() {
return this.size;
}
}
injectMixin(Set, LengthViaSize);
injectMixin(Map, LengthViaSize);
Low-level introspection API. Returns Array
of parent classes including given
import { parentList } from "es6-mixin-nano";
OR
import parentList from "es6-mixin-nano/src/parentList";
// I'll publish the package which use this API
Here is a test example:
class A {};
class B extends A {};
class C extends B {};
class D extends C {};
// parentList(D) === [A, B, C, D]
Both of them does not handle correctly mixins which are subclassed from parent class
Both of them provide high-level API the same as my mix
method, so by
inspiration of them I've create it, test it, but never use it :)
Both of them are dense and ignore SRP. It means you can't use only part of their's functionality -- all or nothing
True minimal implementation, but does not support static class attributes / functions and properties
Nice one, works fine with properties and static attributes and methods
File | % Stmts | % Branch | % Funcs | % Lines |
---|---|---|---|---|
All files | 100 | 100 | 100 | 100 |
index.js | 0 | 0 | 0 | 0 |
injectMany.js | 100 | 100 | 100 | 100 |
injectMixin.js | 100 | 100 | 100 | 100 |
mix.js | 100 | 100 | 100 | 100 |
parentList.js | 100 | 100 | 100 | 100 |
Approximate cost of including es6-mixin-nano
into your application bundle. You
may view full report via running npm run sizereport
. Keep in mind I did not
extract full module code and check only exported function source code size
API Name | Size (bytes) |
---|---|
injectMany | 53 |
injectMixin | 74 |
mix | 80 |
parentList | 74 |