Web Components & Shadow DOM

What lifecycle callbacks are available for Custom Elements?

class MyElement extends HTMLElement {
  constructor() { super(); }
  connectedCallback() { }
  disconnectedCallback() { }
  attributeChangedCallback(name, oldValue, newValue) { }
  adoptedCallback() { }
}

Only constructor and destroy
mount, update, and unmount
constructor, connectedCallback, disconnectedCallback, attributeChangedCallback, and adoptedCallback
Custom Elements have five lifecycle callbacks: 1) constructor() - called when the element is created, 2) connectedCallback() - when the element is added to the DOM, 3) disconnectedCallback() - when removed from the DOM, 4) attributeChangedCallback() - when observed attributes change, 5) adoptedCallback() - when the element is moved to a new document. These provide hooks for initialization, cleanup, and responding to changes.
init, render, and dispose

Next Question (10/20)