Polymer

SPEC	POLYMER	CALLED WHEN
createdCallback	created	An instance of the element is created.
-	ready	The  has been fully prepared (e.g. shadow DOM created, property observers setup, event listeners attached, etc).
attachedCallback	attached	An instance of the element was inserted into the DOM.
-	domReady	Called when the element’s initial set of children are guaranteed to exist. This is an appropriate time to poke at the element’s parent or light DOM children. Another use is when you have sibling custom elements (e.g. they’re.innerHTML‘d together, at the same time). Before element A can use B’s API/properties, element B needs to be upgraded. The domReady callback ensures both elements exist.
detachedCallback	detached	An instance was removed from the DOM.
attributeChangedCallback	attributeChanged	An attribute was added, removed, or updated. Note: to observe changes to published properties, use changed watchers.

The polymer-ready event

Polymer parses element definitions and handles their upgrade asynchronously. If you prematurely fetch the element from the DOM before it has a chance to upgrade, you’ll be working with an HTMLUnknownElement. Polymer elements also support inline resources, such as stylesheets, that need to be loaded. These can causeFOUC issues if they’re not fully loaded prior to rendering an element. To avoid FOUC, Polymer delays registering elements until stylesheets are fully loaded.

To know when elements have been registered/upgraded, and thus ready to be interacted with, use thepolymer-ready event.

   rel="import" href="path/to/x-foo.html">