attachedCallback
This callback is granted to be invoked only *once*, and *before* any other callback, whenever a mixin/behavior is attached through the element's class, somehow simulating what a `constructor` would do with Custom Elements.
This callback is ideal to add related event listeners, setup an element for the specific mixin/behavior, and so on.
Please note that if a mixin/behavior is detached, and then re-attached, this callback *will* be invoked again.
attributeChangedCallback
If any `observedAttributes` is specified, or if there is an `attributeChangedCallback`, this is invoked every time observed attributes change.
Like it is for *Custom Elements*, this callback is invoked, after a mixin/behavior is attached, hence *after* `attachedCallback`, but *before* `connectedCallback`.
This callback is also invoked during the element lifecycle, whenever observed attributes change, providing the `oldValue` and the `newValue`.
Both values are `null` if there was not attribute, or if the attribute got removed, replicating the native *Custom Element* behavior.
connectedCallback
This callback is granted to be invoked *after* an element gets a new mixin/behavior, if the element is already live, and every other time the element gets moved or re-appended on the DOM, exactly like it is for native *Custom Elements*.
Please note that when a mixin/behavior is attached, and there are observed attributes, this callback will be invoked *after* `attributeChangedCallback`.
disconnectedCallback
This callback is granted to be invoked when an element gets removed from the DOM, and it would never trigger if the `connectedCallback` didn't happen already.
Both callbacks are the ideal place to attach, on *connected*, and remove, on *disconnected*, timers, animations, or idle related callbacks, as even when elements get trashed, both callbacks are granted to be executed, and in the right order of events.
detachedCallback
This callback is **not granted to be invoked** if an element get trashed, but it's granted to be invoked *after* `disconnectedCallback`, if a mixin/behavior is removed from an element.
Please note that this callback is *not* really useful for elements that might be, or may not be, trashed, because there is no way to use a *FinalizationRegistry* and pass along the `element`, but it's very hando for those elements that never leave the DOM, but might change, over time, their classes, hence their mixins/behaviors.
```js
import {define} from 'p-cool';
define('mixin', {
attachedCallback(element) {
console.log('mixin attached');
},
detachedCallback(element) {
console.log('mixin detached');
}
});
// example
document.body.innerHTML = `
First
Second
`;
// logs "mixin attached" twice
// will **not** "mixin detached"
first.remove();
// it **will** log "mixin detached"
second.classList.remove('mixin');
```