Web Components — “a suite of different technologies allowing you to create reusable custom elements — with their functionality encapsulated away from the rest of your code — and utilize them in your web apps.”
The
<template>and<slot>elements enable you to write markup templates that are not displayed in the rendered page. These can then be reused multiple times as the basis of a custom element’s structure.
—
kgscialdone/facet : Web components made simple and declarative using one line include of js.
<script src="https://cdn.jsdelivr.net/gh/kgscialdone/[email protected]/facet.min.js"></script>
<template component="hello-world">
<p>Hello, <slot>world</slot>!</p>
</template>
<hello-world></hello-world>
<hello-world>Facet</hello-world> <!-- replaces "world" with "Facet" -->