Source code

Revision control

Other Tools

<!doctype html>
<script src="util.js"></script>
<body>
<script>
const styles = `:host { background: red; width: 100px; height: 100px; display: block; }`.repeat(3000);
customElements.define("custom-element", class CustomElement extends HTMLElement {
connectedCallback() {
this.attachShadow({ mode: "open" });
const style = document.createElement("style");
style.textContent = styles;
this.shadowRoot.appendChild(style);
}
});
onload = function() {
perf_start();
for (let i = 0; i < 1000; ++i) {
document.body.appendChild(document.createElement("custom-element"));
}
flush_layout(document.body);
perf_finish();
};
</script>