Web Components: HTML Templates

Web Components Logo
HTML Templates, das erste Puzzlestück zum Verständniss von Web Components.

Wer Mustache, Handlebars oder doT.js bereits einmal eingesetzt hat ist vertraut mit dem Konzept des Frontend Templating. HTML Templates ist die native Browserumsetzung dieses Konzepts.

HTML Templates sind Markup Schnippsel die es vereinfachen nach dem Laden einer Seite dynamisch Markup hinzuzufügen. Der Inhalt des Templates ist zu Beginn inaktiv und wird beim Seitenaufbau lediglich auf Validität überprüft. Sprich Script Code wird nicht interpretiert, Bilder, Audio sowie andere Resourcen werden nicht geladen und das Markup wird nicht gerendert.
Auf das Markup im Template kann man auch nicht zugreifen über das Dokument Objekt (sprich mit dem querySelector). Erst beim Klonen eines Templates erwacht das Template zum Leben.

(mehr …)