自定义元素与Web组件自定义元素

我刚开始用自定义元素,并根据此文章,自定义的元素可以被定义如下:

var proto = Object.create(HTMLElement.prototype);
proto.createdCallback = function () { ... };
proto.enteredViewCallback = function () { ... };
document.register('x-foo', {
    prototype: proto
});

这在我的chrome浏览器中效果很好,每次创建新元素时都会调用'createdCallback'.

现在,如果我查看这里的官方文档,我没有看到,例如,在任何地方提到的createdCallback.有人理解W3C文档并可以解释为什么会这样吗？

此外,从Web组件查看自定义元素,它们看起来完全不同.所以现在有两种不同类型的自定义元素.这没有任何意义,或者这两者是否可以共存？