Build size: innerHTML based element creation #14529
Description
Re: #13906
We have document.createElement, el.setAttribute, etc calls to generate static DOM trees all over our codebase. For truly static content, we should be providing a html helper to generate these trees:
function html(strings) {
// We don't handle expressions, only fully static trees.
if (strings.length !== 1) throw new Error('non static template detected');
const div = document.createElement('div');
div.innerHTML = strings[0];
return div.firstElementChild;
}
class Example extends BaseElement {
buildCallback() {
const div = html`<div attr="whatever"><p>some static tree</p></div>`;
console.assert(div.tagName === 'div');
}
}/cc @alanorozco