Custom Elements V0 API
A cross browser document.registerElement without built-in extends.
How to use it
Simply include the polyfill on top of your page and use document.registerElement(name, info)
like the good old days.
Compatibility
Same compatibility of original polyfill: every Mobile and Desktop browser.
You can verify your browser compatibility live.
V0 API
var MyElement = document; // example via createElementdocumentbody;// using the class directlydocumentbody;
No extends
will be performed, create extends from your own classes if needed (i.e. from MyElement.prototype
).
Why resurrecting a deprecated API?
TL;DR with native V1 API available it's easy to re-create V0 behavior keeping performance while it's not true the other way around.
This projects solves all transpilations and compatibility issues, providing a reliable, battle tested, V0 API for every browser.
To know more, please read the related blog entry.
Still future friendly!
By no means this project wants to stop adoption or usage of V1 API, quite the opposite, it's waiting for the time where every browser ships it natively, and every part of V0 related code can be dropped to make it a 1KB downgrade fully based on V1, like it is already for both Chrome and Safari.
Don't you like it? Use Component
const MyElement = // the Custom Element name name: 'my-element' // one or more static property static: TEST: 123 {} // alias for createdCallback // the component is ready/upgraded here {} // alias for attributeChangedCallback {} // alias for attachedCallback {} // alias for detachedCallback {} // any other prototype definition is allowed // including getters and setters;