diff --git a/packages/@lwc/engine-core/src/3rdparty/snabbdom/snabbdom.ts b/packages/@lwc/engine-core/src/3rdparty/snabbdom/snabbdom.ts
index 93ab0e92d4..fc72a2d962 100644
--- a/packages/@lwc/engine-core/src/3rdparty/snabbdom/snabbdom.ts
+++ b/packages/@lwc/engine-core/src/3rdparty/snabbdom/snabbdom.ts
@@ -31,11 +31,7 @@ function isVNode(vnode: any): vnode is VNode {
     return vnode != null;
 }
 
-function createKeyToOldIdx(
-    children: Readonly<VNodes>,
-    beginIdx: number,
-    endIdx: number
-): KeyToIndexMap {
+function createKeyToOldIdx(children: VNodes, beginIdx: number, endIdx: number): KeyToIndexMap {
     const map: KeyToIndexMap = {};
     let j: number, key: Key | undefined, ch;
     // TODO [#1637]: simplify this by assuming that all vnodes has keys
@@ -54,7 +50,7 @@ function createKeyToOldIdx(
 function addVnodes(
     parentElm: Node,
     before: Node | null,
-    vnodes: Readonly<VNodes>,
+    vnodes: VNodes,
     startIdx: number,
     endIdx: number
 ) {
@@ -67,12 +63,7 @@ function addVnodes(
     }
 }
 
-function removeVnodes(
-    parentElm: Node,
-    vnodes: Readonly<VNodes>,
-    startIdx: number,
-    endIdx: number
-): void {
+function removeVnodes(parentElm: Node, vnodes: VNodes, startIdx: number, endIdx: number): void {
     for (; startIdx <= endIdx; ++startIdx) {
         const ch = vnodes[startIdx];
         // text nodes do not have logic associated to them
@@ -82,11 +73,7 @@ function removeVnodes(
     }
 }
 
-export function updateDynamicChildren(
-    parentElm: Node,
-    oldCh: Readonly<VNodes>,
-    newCh: Readonly<VNodes>
-) {
+export function updateDynamicChildren(parentElm: Node, oldCh: VNodes, newCh: VNodes) {
     let oldStartIdx = 0;
     let newStartIdx = 0;
     let oldEndIdx = oldCh.length - 1;
@@ -152,12 +139,7 @@ export function updateDynamicChildren(
                         newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm!);
                     } else {
                         patchVnode(elmToMove, newStartVnode);
-                        // Delete the old child, but copy the array since it is read-only.
-                        // The `oldCh` will be GC'ed after `updateDynamicChildren` is complete,
-                        // so we only care about the `oldCh` object inside this function.
-                        const oldChClone = [...oldCh];
-                        oldChClone[idxInOld] = undefined as any;
-                        oldCh = oldChClone;
+                        oldCh[idxInOld] = undefined as any;
                         newStartVnode.hook.move(elmToMove, parentElm, oldStartVnode.elm!);
                     }
                 }
@@ -182,11 +164,7 @@ export function updateDynamicChildren(
     }
 }
 
-export function updateStaticChildren(
-    parentElm: Node,
-    oldCh: Readonly<VNodes>,
-    newCh: Readonly<VNodes>
-) {
+export function updateStaticChildren(parentElm: Node, oldCh: VNodes, newCh: VNodes) {
     const oldChLength = oldCh.length;
     const newChLength = newCh.length;
 
diff --git a/packages/@lwc/engine-core/src/3rdparty/snabbdom/types.ts b/packages/@lwc/engine-core/src/3rdparty/snabbdom/types.ts
index dc948dd8ce..242d47d259 100644
--- a/packages/@lwc/engine-core/src/3rdparty/snabbdom/types.ts
+++ b/packages/@lwc/engine-core/src/3rdparty/snabbdom/types.ts
@@ -21,8 +21,8 @@ export type VNodes = Array<VNode | null>;
 
 export interface VNode {
     sel: string | undefined;
-    data: Readonly<VNodeData>;
-    children: Readonly<VNodes> | undefined;
+    data: VNodeData;
+    children: VNodes | undefined;
     elm: Node | undefined;
     parentElm?: Element;
     text: string | undefined;
@@ -33,8 +33,8 @@ export interface VNode {
 
 export interface VElement extends VNode {
     sel: string;
-    data: Readonly<VElementData>;
-    children: Readonly<VNodes>;
+    data: VElementData;
+    children: VNodes;
     elm: Element | undefined;
     text: undefined;
     key: Key;
@@ -44,7 +44,7 @@ export interface VCustomElement extends VElement {
     mode: 'closed' | 'open';
     ctor: any;
     // copy of the last allocated children.
-    aChildren?: Readonly<VNodes>;
+    aChildren?: VNodes;
 }
 
 export interface VText extends VNode {
@@ -63,21 +63,19 @@ export interface VComment extends VNode {
 }
 
 export interface VNodeData {
-    // All props are readonly because VElementData may be shared across VNodes
-    // due to hoisting optimizations
-    readonly props?: Readonly<Record<string, any>>;
-    readonly attrs?: Readonly<Record<string, string | number | boolean>>;
-    readonly className?: string;
-    readonly style?: string;
-    readonly classMap?: Readonly<Record<string, boolean>>;
-    readonly styleDecls?: Readonly<Array<[string, string, boolean]>>;
-    readonly context?: Readonly<Record<string, Record<string, any>>>;
-    readonly on?: Readonly<Record<string, Function>>;
-    readonly svg?: boolean;
+    props?: Record<string, any>;
+    attrs?: Record<string, string | number | boolean>;
+    className?: string;
+    style?: string;
+    classMap?: Record<string, boolean>;
+    styleDecls?: Array<[string, string, boolean]>;
+    context?: Record<string, Record<string, any>>;
+    on?: Record<string, Function>;
+    svg?: boolean;
 }
 
 export interface VElementData extends VNodeData {
-    readonly key: Key;
+    key: Key;
 }
 
 export interface Hooks<N extends VNode> {
diff --git a/packages/@lwc/engine-core/src/framework/api.ts b/packages/@lwc/engine-core/src/framework/api.ts
index d3585197cc..8073283d4d 100644
--- a/packages/@lwc/engine-core/src/framework/api.ts
+++ b/packages/@lwc/engine-core/src/framework/api.ts
@@ -26,7 +26,7 @@ import {
 import { logError, logWarn } from '../shared/logger';
 import { invokeEventListener } from './invoker';
 import { getVMBeingRendered } from './template';
-import { cloneAndOmitKey, EmptyArray, EmptyObject } from './utils';
+import { EmptyArray, EmptyObject } from './utils';
 import {
     appendVM,
     getAssociatedVMIfPresent,
@@ -204,11 +204,7 @@ const ElementHook: Hooks<VElement> = {
             const { props } = vnode.data;
             if (!isUndefined(props) && !isUndefined(props.innerHTML)) {
                 if (elm.innerHTML === props.innerHTML) {
-                    // Do a shallow clone since VNodeData may be shared across VNodes due to hoist optimization
-                    vnode.data = {
-                        ...vnode.data,
-                        props: cloneAndOmitKey(props, 'innerHTML'),
-                    };
+                    delete props.innerHTML;
                 } else {
                     logWarn(
                         `Mismatch hydrating element <${elm.tagName.toLowerCase()}>: innerHTML values do not match for element, will recover from the difference`,
@@ -353,7 +349,7 @@ function addVNodeToChildLWC(vnode: VCustomElement) {
 }
 
 // [h]tml node
-function h(sel: string, data: Readonly<VElementData>, children: Readonly<VNodes>): VElement {
+function h(sel: string, data: VElementData, children: VNodes): VElement {
     const vmBeingRendered = getVMBeingRendered()!;
     if (process.env.NODE_ENV !== 'production') {
         assert.isTrue(isString(sel), `h() 1st argument sel must be a string.`);
@@ -432,10 +428,10 @@ function ti(value: any): number {
 // [s]lot element node
 function s(
     slotName: string,
-    data: Readonly<VElementData>,
-    children: Readonly<VNodes>,
+    data: VElementData,
+    children: VNodes,
     slotset: SlotSet | undefined
-): VElement | Readonly<VNodes> {
+): VElement | VNodes {
     if (process.env.NODE_ENV !== 'production') {
         assert.isTrue(isString(slotName), `s() 1st argument slotName must be a string.`);
         assert.isTrue(isObject(data), `s() 2nd argument data must be an object.`);
@@ -795,10 +791,8 @@ function dc(
     // the new vnode key is a mix of idx and compiler key, this is required by the diffing algo
     // to identify different constructors as vnodes with different keys to avoid reusing the
     // element used for previous constructors.
-    // Shallow clone is necessary here becuase VElementData may be shared across VNodes due to
-    // hoisting optimization.
-    const newData = { ...data, key: `dc:${idx}:${data.key}` };
-    return c(sel, Ctor, newData, children);
+    data.key = `dc:${idx}:${data.key}`;
+    return c(sel, Ctor, data, children);
 }
 
 /**
@@ -814,7 +808,7 @@ function dc(
  *   - children that are produced by iteration
  *
  */
-function sc(vnodes: Readonly<VNodes>): Readonly<VNodes> {
+function sc(vnodes: VNodes): VNodes {
     if (process.env.NODE_ENV !== 'production') {
         assert.isTrue(isArray(vnodes), 'sc() api can only work with arrays.');
     }
diff --git a/packages/@lwc/engine-core/src/framework/hooks.ts b/packages/@lwc/engine-core/src/framework/hooks.ts
index 732dfecec6..5388cdf7c9 100644
--- a/packages/@lwc/engine-core/src/framework/hooks.ts
+++ b/packages/@lwc/engine-core/src/framework/hooks.ts
@@ -374,11 +374,7 @@ function throwHydrationError() {
     assert.fail('Server rendered elements do not match client side generated elements');
 }
 
-export function hydrateChildrenHook(
-    elmChildren: Readonly<NodeListOf<ChildNode>>,
-    children: Readonly<VNodes>,
-    vm?: VM
-) {
+export function hydrateChildrenHook(elmChildren: NodeListOf<ChildNode>, children: VNodes, vm?: VM) {
     if (process.env.NODE_ENV !== 'production') {
         const filteredVNodes = ArrayFilter.call(children, (vnode) => !!vnode);
 
@@ -452,14 +448,14 @@ export function removeElmHook(vnode: VElement) {
 }
 
 // Using a WeakMap instead of a WeakSet because this one works in IE11 :(
-const FromIteration: WeakMap<Readonly<VNodes>, 1> = new WeakMap();
+const FromIteration: WeakMap<VNodes, 1> = new WeakMap();
 
 // dynamic children means it was generated by an iteration
 // in a template, and will require a more complex diffing algo.
-export function markAsDynamicChildren(children: Readonly<VNodes>) {
+export function markAsDynamicChildren(children: VNodes) {
     FromIteration.set(children, 1);
 }
 
-export function hasDynamicChildren(children: Readonly<VNodes>): boolean {
+export function hasDynamicChildren(children: VNodes): boolean {
     return FromIteration.has(children);
 }
diff --git a/packages/@lwc/engine-core/src/framework/utils.ts b/packages/@lwc/engine-core/src/framework/utils.ts
index 6f6861c373..c70757139f 100644
--- a/packages/@lwc/engine-core/src/framework/utils.ts
+++ b/packages/@lwc/engine-core/src/framework/utils.ts
@@ -74,14 +74,3 @@ export function parseStyleText(cssText: string): { [name: string]: string } {
 
     return styleMap;
 }
-
-// Make a shallow copy of an object but omit the given key
-export function cloneAndOmitKey(object: { [key: string]: any }, keyToOmit: string) {
-    const result: { [key: string]: any } = {};
-    for (const key of Object.keys(object)) {
-        if (key !== keyToOmit) {
-            result[key] = object[key];
-        }
-    }
-    return result;
-}
diff --git a/packages/@lwc/engine-core/src/framework/vm.ts b/packages/@lwc/engine-core/src/framework/vm.ts
index 3f9f4929df..6bef3c62a4 100644
--- a/packages/@lwc/engine-core/src/framework/vm.ts
+++ b/packages/@lwc/engine-core/src/framework/vm.ts
@@ -117,9 +117,9 @@ export interface VM<N = HostNode, E = HostElement> {
     /** The component connection state. */
     state: VMState;
     /** The list of VNodes associated with the shadow tree. */
-    children: Readonly<VNodes>;
+    children: VNodes;
     /** The list of adopted children VNodes. */
-    aChildren: Readonly<VNodes>;
+    aChildren: VNodes;
     /** The list of custom elements VNodes currently rendered in the shadow tree. We keep track of
      * those elements to efficiently unmount them when the parent component is disconnected without
      * having to traverse the VNode tree. */
@@ -634,7 +634,7 @@ function runLightChildNodesDisconnectedCallback(vm: VM) {
  * custom element itself will trigger the removal of anything slotted or anything
  * defined on its shadow.
  */
-function recursivelyDisconnectChildren(vnodes: Readonly<VNodes>) {
+function recursivelyDisconnectChildren(vnodes: VNodes) {
     for (let i = 0, len = vnodes.length; i < len; i += 1) {
         const vnode: VCustomElement | VNode | null = vnodes[i];
         if (!isNull(vnode) && isArray(vnode.children) && !isUndefined(vnode.elm)) {
@@ -699,7 +699,7 @@ function getErrorBoundaryVM(vm: VM): VM | undefined {
 // slow path routine
 // NOTE: we should probably more this routine to the synthetic shadow folder
 // and get the allocation to be cached by in the elm instead of in the VM
-export function allocateInSlot(vm: VM, children: Readonly<VNodes>) {
+export function allocateInSlot(vm: VM, children: VNodes) {
     const { cmpSlots: oldSlots } = vm;
     const cmpSlots = (vm.cmpSlots = create(null));
     for (let i = 0, len = children.length; i < len; i += 1) {
diff --git a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_compat_config_simple_app.js b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_compat_config_simple_app.js
index 82dd66069f..78f1ba6bf9 100644
--- a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_compat_config_simple_app.js
+++ b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_compat_config_simple_app.js
@@ -75,15 +75,13 @@
 
   var _implicitStylesheets = [stylesheet];
 
-  var stc0$1 = {
-    key: 0
-  };
-
   function tmpl$1($api, $cmp, $slotset, $ctx) {
     var api_dynamic_text = $api._ES5ProxyType ? $api.get("d") : $api.d,
         api_text = $api._ES5ProxyType ? $api.get("t") : $api.t,
         api_element = $api._ES5ProxyType ? $api.get("h") : $api.h;
-    return [api_element("div", stc0$1, [api_text(api_dynamic_text($cmp._ES5ProxyType ? $cmp.get("x") : $cmp.x))])];
+    return [api_element("div", {
+      key: 0
+    }, [api_text(api_dynamic_text($cmp._ES5ProxyType ? $cmp.get("x") : $cmp.x))])];
   }
 
   var _tmpl$1 = lwc.registerTemplate(tmpl$1);
@@ -136,24 +134,20 @@
     tmpl: _tmpl$1
   });
 
-  var stc0 = {
-    classMap: {
-      "container": true
-    },
-    key: 0
-  };
-  var stc1 = {
-    props: {
-      "x": "1"
-    },
-    key: 1
-  };
-  var stc2 = [];
-
   function tmpl($api, $cmp, $slotset, $ctx) {
     var api_custom_element = $api._ES5ProxyType ? $api.get("c") : $api.c,
         api_element = $api._ES5ProxyType ? $api.get("h") : $api.h;
-    return [api_element("div", stc0, [api_custom_element("x-foo", _xFoo, stc1, stc2)])];
+    return [api_element("div", {
+      classMap: {
+        "container": true
+      },
+      key: 0
+    }, [api_custom_element("x-foo", _xFoo, {
+      props: {
+        "x": "1"
+      },
+      key: 1
+    }, [])])];
   }
 
   var _tmpl = lwc.registerTemplate(tmpl);
diff --git a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app.js b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app.js
index 1b84ddead7..512addc1e7 100644
--- a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app.js
+++ b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app.js
@@ -7,12 +7,11 @@
     }
     var _implicitStylesheets = [stylesheet];
 
-    const stc0$1 = {
-      key: 0
-    };
     function tmpl$1($api, $cmp, $slotset, $ctx) {
       const {d: api_dynamic_text, t: api_text, h: api_element} = $api;
-      return [api_element("div", stc0$1, [api_text(api_dynamic_text($cmp.x))])];
+      return [api_element("div", {
+        key: 0
+      }, [api_text(api_dynamic_text($cmp.x))])];
     }
     var _tmpl$1 = lwc.registerTemplate(tmpl$1);
     tmpl$1.stylesheets = [];
@@ -43,22 +42,19 @@
       tmpl: _tmpl$1
     });
 
-    const stc0 = {
-      classMap: {
-        "container": true
-      },
-      key: 0
-    };
-    const stc1 = {
-      props: {
-        "x": "1"
-      },
-      key: 1
-    };
-    const stc2 = [];
     function tmpl($api, $cmp, $slotset, $ctx) {
       const {c: api_custom_element, h: api_element} = $api;
-      return [api_element("div", stc0, [api_custom_element("x-foo", _xFoo, stc1, stc2)])];
+      return [api_element("div", {
+        classMap: {
+          "container": true
+        },
+        key: 0
+      }, [api_custom_element("x-foo", _xFoo, {
+        props: {
+          "x": "1"
+        },
+        key: 1
+      }, [])])];
     }
     var _tmpl = lwc.registerTemplate(tmpl);
     tmpl.stylesheets = [];
diff --git a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_css_resolver.js b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_css_resolver.js
index 3eb529a9f8..54aab5e580 100644
--- a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_css_resolver.js
+++ b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_css_resolver.js
@@ -11,12 +11,11 @@
     }
     var _implicitStylesheets = [stylesheet];
 
-    const stc0$1 = {
-      key: 0
-    };
     function tmpl$1($api, $cmp, $slotset, $ctx) {
       const {d: api_dynamic_text, t: api_text, h: api_element} = $api;
-      return [api_element("div", stc0$1, [api_text(api_dynamic_text($cmp.x))])];
+      return [api_element("div", {
+        key: 0
+      }, [api_text(api_dynamic_text($cmp.x))])];
     }
     var _tmpl$1 = lwc.registerTemplate(tmpl$1);
     tmpl$1.stylesheets = [];
@@ -47,22 +46,19 @@
       tmpl: _tmpl$1
     });
 
-    const stc0 = {
-      classMap: {
-        "container": true
-      },
-      key: 0
-    };
-    const stc1 = {
-      props: {
-        "x": "1"
-      },
-      key: 1
-    };
-    const stc2 = [];
     function tmpl($api, $cmp, $slotset, $ctx) {
       const {c: api_custom_element, h: api_element} = $api;
-      return [api_element("div", stc0, [api_custom_element("x-foo", _xFoo, stc1, stc2)])];
+      return [api_element("div", {
+        classMap: {
+          "container": true
+        },
+        key: 0
+      }, [api_custom_element("x-foo", _xFoo, {
+        props: {
+          "x": "1"
+        },
+        key: 1
+      }, [])])];
     }
     var _tmpl = lwc.registerTemplate(tmpl);
     tmpl.stylesheets = [];
diff --git a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_relative.js b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_relative.js
index 1b84ddead7..512addc1e7 100644
--- a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_relative.js
+++ b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_relative.js
@@ -7,12 +7,11 @@
     }
     var _implicitStylesheets = [stylesheet];
 
-    const stc0$1 = {
-      key: 0
-    };
     function tmpl$1($api, $cmp, $slotset, $ctx) {
       const {d: api_dynamic_text, t: api_text, h: api_element} = $api;
-      return [api_element("div", stc0$1, [api_text(api_dynamic_text($cmp.x))])];
+      return [api_element("div", {
+        key: 0
+      }, [api_text(api_dynamic_text($cmp.x))])];
     }
     var _tmpl$1 = lwc.registerTemplate(tmpl$1);
     tmpl$1.stylesheets = [];
@@ -43,22 +42,19 @@
       tmpl: _tmpl$1
     });
 
-    const stc0 = {
-      classMap: {
-        "container": true
-      },
-      key: 0
-    };
-    const stc1 = {
-      props: {
-        "x": "1"
-      },
-      key: 1
-    };
-    const stc2 = [];
     function tmpl($api, $cmp, $slotset, $ctx) {
       const {c: api_custom_element, h: api_element} = $api;
-      return [api_element("div", stc0, [api_custom_element("x-foo", _xFoo, stc1, stc2)])];
+      return [api_element("div", {
+        classMap: {
+          "container": true
+        },
+        key: 0
+      }, [api_custom_element("x-foo", _xFoo, {
+        props: {
+          "x": "1"
+        },
+        key: 1
+      }, [])])];
     }
     var _tmpl = lwc.registerTemplate(tmpl);
     tmpl.stylesheets = [];
diff --git a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_third_party.js b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_third_party.js
index 6a0a5d9d14..dd50e0f757 100644
--- a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_third_party.js
+++ b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_third_party.js
@@ -1,12 +1,11 @@
 (function (lwc) {
   'use strict';
 
-  const stc0 = {
-    key: 0
-  };
   function tmpl($api, $cmp, $slotset, $ctx) {
     const {d: api_dynamic_text, t: api_text, h: api_element} = $api;
-    return [api_element("pre", stc0, [api_text(api_dynamic_text($cmp.hello))])];
+    return [api_element("pre", {
+      key: 0
+    }, [api_text(api_dynamic_text($cmp.hello))])];
   }
   var _tmpl = lwc.registerTemplate(tmpl);
   tmpl.stylesheets = [];
diff --git a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_with_scoped_styles.js b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_with_scoped_styles.js
index 37a0354dd3..4c8f9686b7 100644
--- a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_with_scoped_styles.js
+++ b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_simple_app_with_scoped_styles.js
@@ -8,13 +8,11 @@
   stylesheet.$scoped$ = true;
   var _implicitScopedStylesheets = [stylesheet];
 
-  const stc0 = {
-    key: 0
-  };
-  const stc1 = [];
   function tmpl($api, $cmp, $slotset, $ctx) {
     const {h: api_element} = $api;
-    return [api_element("div", stc0, stc1)];
+    return [api_element("div", {
+      key: 0
+    }, [])];
   }
   var _tmpl = lwc.registerTemplate(tmpl);
   tmpl.stylesheets = [];
diff --git a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_ts_simple_app.js b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_ts_simple_app.js
index b3ce2a1704..c0524c276f 100644
--- a/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_ts_simple_app.js
+++ b/packages/@lwc/rollup-plugin/src/__tests__/fixtures/expected_default_config_ts_simple_app.js
@@ -7,12 +7,11 @@
     }
     var _implicitStylesheets = [stylesheet];
 
-    const stc0$1 = {
-      key: 0
-    };
     function tmpl$1($api, $cmp, $slotset, $ctx) {
       const {d: api_dynamic_text, t: api_text, h: api_element} = $api;
-      return [api_element("div", stc0$1, [api_text(api_dynamic_text($cmp.x))])];
+      return [api_element("div", {
+        key: 0
+      }, [api_text(api_dynamic_text($cmp.x))])];
     }
     var _tmpl$1 = lwc.registerTemplate(tmpl$1);
     tmpl$1.stylesheets = [];
@@ -43,22 +42,19 @@
       tmpl: _tmpl$1
     });
 
-    const stc0 = {
-      classMap: {
-        "container": true
-      },
-      key: 0
-    };
-    const stc1 = {
-      props: {
-        "x": "1"
-      },
-      key: 1
-    };
-    const stc2 = [];
     function tmpl($api, $cmp, $slotset, $ctx) {
       const {c: api_custom_element, h: api_element} = $api;
-      return [api_element("div", stc0, [api_custom_element("ts-foo", _tsFoo, stc1, stc2)])];
+      return [api_element("div", {
+        classMap: {
+          "container": true
+        },
+        key: 0
+      }, [api_custom_element("ts-foo", _tsFoo, {
+        props: {
+          "x": "1"
+        },
+        key: 1
+      }, [])])];
     }
     var _tmpl = lwc.registerTemplate(tmpl);
     tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js
index fba04483dd..4932de5532 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js
@@ -1,14 +1,18 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    allow: "geolocation https://google-developers.appspot.com",
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("iframe", stc0, stc1)];
+  return [
+    api_element(
+      "iframe",
+      {
+        attrs: {
+          allow: "geolocation https://google-developers.appspot.com",
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-crossorigin/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-crossorigin/expected.js
index 829d619732..4bc8e2f3ed 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-crossorigin/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-crossorigin/expected.js
@@ -1,32 +1,40 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    src: "http://www.example.com/image.png",
-    crossorigin: "anonymous",
-  },
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  attrs: {
-    src: "http://www.example.com/video.mp4",
-    crossorigin: "anonymous",
-  },
-  key: 1,
-};
-const stc3 = {
-  attrs: {
-    src: "http://www.example.com/video.mp3",
-    crossorigin: "anonymous",
-  },
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("img", stc0, stc1),
-    api_element("video", stc2, stc1),
-    api_element("audio", stc3, stc1),
+    api_element(
+      "img",
+      {
+        attrs: {
+          src: "http://www.example.com/image.png",
+          crossorigin: "anonymous",
+        },
+        key: 0,
+      },
+      []
+    ),
+    api_element(
+      "video",
+      {
+        attrs: {
+          src: "http://www.example.com/video.mp4",
+          crossorigin: "anonymous",
+        },
+        key: 1,
+      },
+      []
+    ),
+    api_element(
+      "audio",
+      {
+        attrs: {
+          src: "http://www.example.com/video.mp3",
+          crossorigin: "anonymous",
+        },
+        key: 2,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id-expression/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id-expression/expected.js
index d877f31bf5..61112f34e9 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id-expression/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id-expression/expected.js
@@ -1,8 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 1,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     fid: api_scoped_frag_id,
@@ -21,28 +17,34 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       },
       [api_text("KIX")]
     ),
-    api_element("map", stc0, [
-      api_element(
-        "area",
-        {
-          attrs: {
-            href: api_scoped_frag_id("#haneda"),
+    api_element(
+      "map",
+      {
+        key: 1,
+      },
+      [
+        api_element(
+          "area",
+          {
+            attrs: {
+              href: api_scoped_frag_id("#haneda"),
+            },
+            key: 2,
           },
-          key: 2,
-        },
-        stc1
-      ),
-      api_element(
-        "area",
-        {
-          attrs: {
-            href: api_scoped_frag_id("#chubu"),
+          []
+        ),
+        api_element(
+          "area",
+          {
+            attrs: {
+              href: api_scoped_frag_id("#chubu"),
+            },
+            key: 3,
           },
-          key: 3,
-        },
-        stc1
-      ),
-    ]),
+          []
+        ),
+      ]
+    ),
     api_element(
       "h1",
       {
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id/expected.js
index c31f38e19a..f1bac5afbf 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href-with-id/expected.js
@@ -1,8 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 1,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     fid: api_scoped_frag_id,
@@ -21,28 +17,34 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       },
       [api_text("KIX")]
     ),
-    api_element("map", stc0, [
-      api_element(
-        "area",
-        {
-          attrs: {
-            href: api_scoped_frag_id("#eneos-gas"),
+    api_element(
+      "map",
+      {
+        key: 1,
+      },
+      [
+        api_element(
+          "area",
+          {
+            attrs: {
+              href: api_scoped_frag_id("#eneos-gas"),
+            },
+            key: 2,
           },
-          key: 2,
-        },
-        stc1
-      ),
-      api_element(
-        "area",
-        {
-          attrs: {
-            href: api_scoped_frag_id("#kawaramachi"),
+          []
+        ),
+        api_element(
+          "area",
+          {
+            attrs: {
+              href: api_scoped_frag_id("#kawaramachi"),
+            },
+            key: 3,
           },
-          key: 3,
-        },
-        stc1
-      ),
-    ]),
+          []
+        ),
+      ]
+    ),
     api_element(
       "h1",
       {
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href/expected.js
index 88856761fd..28ce366510 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-href/expected.js
@@ -1,34 +1,45 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    href: "#yasaka-taxi",
-  },
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  attrs: {
-    href: "#eneos-gas",
-  },
-  key: 2,
-};
-const stc3 = [];
-const stc4 = {
-  attrs: {
-    href: "#kawaramachi",
-  },
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("a", stc0, [api_text("Yasaka Taxi")]),
-    api_element("map", stc1, [
-      api_element("area", stc2, stc3),
-      api_element("area", stc4, stc3),
-    ]),
+    api_element(
+      "a",
+      {
+        attrs: {
+          href: "#yasaka-taxi",
+        },
+        key: 0,
+      },
+      [api_text("Yasaka Taxi")]
+    ),
+    api_element(
+      "map",
+      {
+        key: 1,
+      },
+      [
+        api_element(
+          "area",
+          {
+            attrs: {
+              href: "#eneos-gas",
+            },
+            key: 2,
+          },
+          []
+        ),
+        api_element(
+          "area",
+          {
+            attrs: {
+              href: "#kawaramachi",
+            },
+            key: 3,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-uppercase/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-uppercase/expected.js
index 9387cc7b5f..b52f7ce789 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-uppercase/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-uppercase/expected.js
@@ -1,21 +1,26 @@
 import _xButton from "x/button";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  props: {
-    Class: "r",
-    DataXx: "foo",
-    AriaHidden: "hidden",
-    Role: "xx",
-    FooBar: "x",
-    FooZaz: "z",
-    Foo_bar_baz: "baz",
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { c: api_custom_element } = $api;
-  return [api_custom_element("x-button", _xButton, stc0, stc1)];
+  return [
+    api_custom_element(
+      "x-button",
+      _xButton,
+      {
+        props: {
+          Class: "r",
+          DataXx: "foo",
+          AriaHidden: "hidden",
+          Role: "xx",
+          FooBar: "x",
+          FooZaz: "z",
+          Foo_bar_baz: "baz",
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/hidden-global-attr/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/hidden-global-attr/expected.js
index ab58ffc1f5..ac0385e219 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/hidden-global-attr/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/hidden-global-attr/expected.js
@@ -1,59 +1,38 @@
 import _xFoo from "x/foo";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    hidden: "",
-  },
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    hidden: "",
-  },
-  key: 1,
-};
-const stc2 = {
-  attrs: {
-    hidden: "other than true",
-  },
-  key: 2,
-};
-const stc3 = {
-  attrs: {
-    hidden: "3",
-  },
-  key: 4,
-};
-const stc4 = {
-  props: {
-    hidden: true,
-  },
-  key: 5,
-};
-const stc5 = {
-  props: {
-    hidden: true,
-  },
-  key: 6,
-};
-const stc6 = {
-  props: {
-    hidden: true,
-  },
-  key: 7,
-};
-const stc7 = {
-  props: {
-    hidden: true,
-  },
-  key: 9,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, c: api_custom_element } = $api;
   return [
-    api_element("p", stc0, [api_text("boolean present")]),
-    api_element("p", stc1, [api_text("empty string, should be true")]),
-    api_element("p", stc2, [api_text("string value, should be true")]),
+    api_element(
+      "p",
+      {
+        attrs: {
+          hidden: "",
+        },
+        key: 0,
+      },
+      [api_text("boolean present")]
+    ),
+    api_element(
+      "p",
+      {
+        attrs: {
+          hidden: "",
+        },
+        key: 1,
+      },
+      [api_text("empty string, should be true")]
+    ),
+    api_element(
+      "p",
+      {
+        attrs: {
+          hidden: "other than true",
+        },
+        key: 2,
+      },
+      [api_text("string value, should be true")]
+    ),
     api_element(
       "p",
       {
@@ -64,14 +43,49 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       },
       [api_text("computed value, should be resolved in component")]
     ),
-    api_element("p", stc3, [api_text("integer value, should be true")]),
-    api_custom_element("x-foo", _xFoo, stc4, [api_text("boolean present")]),
-    api_custom_element("x-foo", _xFoo, stc5, [
-      api_text("empty string, should be true"),
-    ]),
-    api_custom_element("x-foo", _xFoo, stc6, [
-      api_text("string value, should be true"),
-    ]),
+    api_element(
+      "p",
+      {
+        attrs: {
+          hidden: "3",
+        },
+        key: 4,
+      },
+      [api_text("integer value, should be true")]
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          hidden: true,
+        },
+        key: 5,
+      },
+      [api_text("boolean present")]
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          hidden: true,
+        },
+        key: 6,
+      },
+      [api_text("empty string, should be true")]
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          hidden: true,
+        },
+        key: 7,
+      },
+      [api_text("string value, should be true")]
+    ),
     api_custom_element(
       "x-foo",
       _xFoo,
@@ -83,9 +97,17 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       },
       [api_text("computed value, should be resolved in component")]
     ),
-    api_custom_element("x-foo", _xFoo, stc7, [
-      api_text("integer value, should be true"),
-    ]),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          hidden: true,
+        },
+        key: 9,
+      },
+      [api_text("integer value, should be true")]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/required/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/required/expected.js
index d3e050d953..092708b2fa 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/required/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attribute/required/expected.js
@@ -1,90 +1,106 @@
 import _xFoo from "x/foo";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    required: "",
-  },
-  props: {
-    value: "boolean present",
-  },
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  attrs: {
-    required: "",
-  },
-  props: {
-    value: "empty string",
-  },
-  key: 1,
-};
-const stc3 = {
-  attrs: {
-    required: "other than true",
-  },
-  props: {
-    value: "string value",
-  },
-  key: 2,
-};
-const stc4 = {
-  value: "computed value",
-};
-const stc5 = {
-  attrs: {
-    required: "3",
-  },
-  props: {
-    value: "integer value",
-  },
-  key: 4,
-};
-const stc6 = {
-  props: {
-    required: true,
-  },
-  key: 5,
-};
-const stc7 = {
-  props: {
-    required: "",
-  },
-  key: 6,
-};
-const stc8 = {
-  props: {
-    required: "other than true",
-  },
-  key: 7,
-};
-const stc9 = {
-  props: {
-    required: "3",
-  },
-  key: 9,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element, t: api_text, c: api_custom_element } = $api;
   return [
-    api_element("input", stc0, stc1),
-    api_element("input", stc2, stc1),
-    api_element("input", stc3, stc1),
+    api_element(
+      "input",
+      {
+        attrs: {
+          required: "",
+        },
+        props: {
+          value: "boolean present",
+        },
+        key: 0,
+      },
+      []
+    ),
+    api_element(
+      "input",
+      {
+        attrs: {
+          required: "",
+        },
+        props: {
+          value: "empty string",
+        },
+        key: 1,
+      },
+      []
+    ),
+    api_element(
+      "input",
+      {
+        attrs: {
+          required: "other than true",
+        },
+        props: {
+          value: "string value",
+        },
+        key: 2,
+      },
+      []
+    ),
     api_element(
       "input",
       {
         attrs: {
           required: $cmp.computed ? "" : null,
         },
-        props: stc4,
+        props: {
+          value: "computed value",
+        },
         key: 3,
       },
-      stc1
+      []
+    ),
+    api_element(
+      "input",
+      {
+        attrs: {
+          required: "3",
+        },
+        props: {
+          value: "integer value",
+        },
+        key: 4,
+      },
+      []
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          required: true,
+        },
+        key: 5,
+      },
+      [api_text("boolean present")]
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          required: "",
+        },
+        key: 6,
+      },
+      [api_text("empty string")]
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          required: "other than true",
+        },
+        key: 7,
+      },
+      [api_text("string value")]
     ),
-    api_element("input", stc5, stc1),
-    api_custom_element("x-foo", _xFoo, stc6, [api_text("boolean present")]),
-    api_custom_element("x-foo", _xFoo, stc7, [api_text("empty string")]),
-    api_custom_element("x-foo", _xFoo, stc8, [api_text("string value")]),
     api_custom_element(
       "x-foo",
       _xFoo,
@@ -96,7 +112,17 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       },
       [api_text("computed value, should be resolved in component")]
     ),
-    api_custom_element("x-foo", _xFoo, stc9, [api_text("integer value")]),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          required: "3",
+        },
+        key: 9,
+      },
+      [api_text("integer value")]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attributes-valid/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attributes-valid/expected.js
index c4d74b3031..7c2a83aafc 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attributes-valid/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean-attributes-valid/expected.js
@@ -1,37 +1,43 @@
 import _xFoo from "x/foo";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    hidden: "",
-  },
-  key: 0,
-};
-const stc1 = {
-  props: {
-    autofocus: "true",
-    autoplay: "true",
-    capture: "true",
-    checked: "true",
-    disabled: "true",
-    formnovalidate: "true",
-    loop: "true",
-    multiple: "true",
-    muted: "true",
-    noValidate: "true",
-    open: "true",
-    readOnly: "true",
-    required: "true",
-    reversed: "true",
-    selected: "true",
-  },
-  key: 1,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, c: api_custom_element } = $api;
   return [
-    api_element("p", stc0, [api_text("x")]),
-    api_custom_element("x-foo", _xFoo, stc1, stc2),
+    api_element(
+      "p",
+      {
+        attrs: {
+          hidden: "",
+        },
+        key: 0,
+      },
+      [api_text("x")]
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          autofocus: "true",
+          autoplay: "true",
+          capture: "true",
+          checked: "true",
+          disabled: "true",
+          formnovalidate: "true",
+          loop: "true",
+          multiple: "true",
+          muted: "true",
+          noValidate: "true",
+          open: "true",
+          readOnly: "true",
+          required: "true",
+          reversed: "true",
+          selected: "true",
+        },
+        key: 1,
+      },
+      []
+    ),
     api_element(
       "input",
       {
@@ -42,7 +48,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 2,
       },
-      stc2
+      []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean/expected.js
index 62729d7f72..259e51226a 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/boolean/expected.js
@@ -1,15 +1,17 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    hidden: "",
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("p", stc0, [api_text("x")]),
+    api_element(
+      "p",
+      {
+        attrs: {
+          hidden: "",
+        },
+        key: 0,
+      },
+      [api_text("x")]
+    ),
     api_element(
       "input",
       {
@@ -20,7 +22,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 1,
       },
-      stc1
+      []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/class/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/class/expected.js
index c52dc25906..3baa14161e 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/class/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/class/expected.js
@@ -1,39 +1,50 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  classMap: {
-    foo: true,
-  },
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  classMap: {
-    foo: true,
-    bar: true,
-  },
-  key: 1,
-};
-const stc3 = {
-  classMap: {
-    foo: true,
-    bar: true,
-  },
-  key: 2,
-};
-const stc4 = {
-  classMap: {
-    foo: true,
-    bar: true,
-  },
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("div", stc0, stc1),
-    api_element("div", stc2, stc1),
-    api_element("div", stc3, stc1),
-    api_element("div", stc4, stc1),
+    api_element(
+      "div",
+      {
+        classMap: {
+          foo: true,
+        },
+        key: 0,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        classMap: {
+          foo: true,
+          bar: true,
+        },
+        key: 1,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        classMap: {
+          foo: true,
+          bar: true,
+        },
+        key: 2,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        classMap: {
+          foo: true,
+          bar: true,
+        },
+        key: 3,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset-complex/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset-complex/expected.js
index 85c4ad7adb..10896010f8 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset-complex/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset-complex/expected.js
@@ -1,17 +1,26 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    "data--bar-baz": "xyz",
-  },
-  key: 1,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("section", stc0, [api_element("p", stc1, stc2)])];
+  return [
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            attrs: {
+              "data--bar-baz": "xyz",
+            },
+            key: 1,
+          },
+          []
+        ),
+      ]
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset/expected.js
index bc46bc5df5..3cb93af7eb 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/dataset/expected.js
@@ -1,18 +1,27 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    "data-foo": "1",
-    "data-bar-baz": "xyz",
-  },
-  key: 1,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("section", stc0, [api_element("p", stc1, stc2)])];
+  return [
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            attrs: {
+              "data-foo": "1",
+              "data-bar-baz": "xyz",
+            },
+            key: 1,
+          },
+          []
+        ),
+      ]
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/error-empty-value/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/error-empty-value/expected.js
index e9aca2c30f..0bf08aee15 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/error-empty-value/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/error-empty-value/expected.js
@@ -1,24 +1,30 @@
 import _fooBar from "foo/bar";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    title: "",
-  },
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  props: {
-    content: "",
-    visible: true,
-  },
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element, c: api_custom_element } = $api;
   return [
-    api_element("p", stc0, stc1),
-    api_custom_element("foo-bar", _fooBar, stc2, stc1),
+    api_element(
+      "p",
+      {
+        attrs: {
+          title: "",
+        },
+        key: 0,
+      },
+      []
+    ),
+    api_custom_element(
+      "foo-bar",
+      _fooBar,
+      {
+        props: {
+          content: "",
+          visible: true,
+        },
+        key: 1,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-input/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-input/expected.js
index a3d5b38525..fdb28f3ade 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-input/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-input/expected.js
@@ -1,21 +1,25 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    type: "checkbox",
-    required: "",
-    readonly: "",
-    minlength: "5",
-    maxlength: "10",
-  },
-  props: {
-    checked: true,
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("input", stc0, stc1)];
+  return [
+    api_element(
+      "input",
+      {
+        attrs: {
+          type: "checkbox",
+          required: "",
+          readonly: "",
+          minlength: "5",
+          maxlength: "10",
+        },
+        props: {
+          checked: true,
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag-invalid/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag-invalid/expected.js
index 123d3dfbc6..215ea3cf14 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag-invalid/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag-invalid/expected.js
@@ -1,21 +1,27 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    minlength: "1",
-    maxlength: "5",
-    "unknown-attr": "should-error",
-  },
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      api_element("textarea", stc1, [api_text("x")]),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "textarea",
+          {
+            attrs: {
+              minlength: "1",
+              maxlength: "5",
+              "unknown-attr": "should-error",
+            },
+            key: 1,
+          },
+          [api_text("x")]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag/expected.js
index b46ba9f33c..15a4dd2994 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/html-tag/expected.js
@@ -1,18 +1,26 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    title: "x",
-    "aria-hidden": "x",
-  },
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [api_element("p", stc1, [api_text("x")])]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            attrs: {
+              title: "x",
+              "aria-hidden": "x",
+            },
+            key: 1,
+          },
+          [api_text("x")]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/id/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/id/expected.js
index 1b8404e3b0..333864fca0 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/id/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/id/expected.js
@@ -2,7 +2,6 @@ import _xSubject from "x/subject";
 import _xDescription from "x/description";
 import _xTextarea from "x/textarea";
 import { registerTemplate } from "lwc";
-const stc0 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     gid: api_scoped_id,
@@ -23,7 +22,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 0,
       },
-      stc0
+      []
     ),
     api_custom_element(
       "x-description",
@@ -34,7 +33,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 1,
       },
-      stc0
+      []
     ),
     api_custom_element(
       "x-description",
@@ -45,7 +44,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 2,
       },
-      stc0
+      []
     ),
     api_custom_element(
       "x-textarea",
@@ -57,7 +56,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 3,
       },
-      stc0
+      []
     ),
     api_element(
       "label",
@@ -77,7 +76,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 5,
       },
-      stc0
+      []
     ),
     api_iterator($cmp.things, function (thing) {
       return [
@@ -99,7 +98,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
             },
             key: api_key(7, thing.key),
           },
-          stc0
+          []
         ),
       ];
     }),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/mixed-props-attrs/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/mixed-props-attrs/expected.js
index 803e0a793e..a14d92f425 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/mixed-props-attrs/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/mixed-props-attrs/expected.js
@@ -1,46 +1,6 @@
 import _nsFoo from "ns/foo";
 import _nsBar from "ns/bar";
 import { registerTemplate, sanitizeAttribute } from "lwc";
-const stc0 = [];
-const stc1 = {
-  classMap: {
-    test: true,
-  },
-  attrs: {
-    "data-foo": "datafoo",
-    "aria-hidden": "h",
-    role: "presentation",
-    href: "/foo",
-    title: "test",
-    tabindex: "-1",
-  },
-  key: 1,
-};
-const stc2 = {
-  r: true,
-};
-const stc3 = {
-  "data-xx": "foo",
-};
-const stc4 = {
-  classMap: {
-    cubano: true,
-  },
-  attrs: {
-    focusable: "true",
-  },
-  key: 3,
-  svg: true,
-};
-const stc5 = {
-  attrs: {
-    bgcolor: "x",
-  },
-  key: 5,
-};
-const stc6 = {
-  "aria-hidden": "hidden",
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { gid: api_scoped_id, c: api_custom_element, h: api_element } = $api;
   return [
@@ -54,15 +14,36 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 0,
       },
-      stc0
+      []
+    ),
+    api_element(
+      "a",
+      {
+        classMap: {
+          test: true,
+        },
+        attrs: {
+          "data-foo": "datafoo",
+          "aria-hidden": "h",
+          role: "presentation",
+          href: "/foo",
+          title: "test",
+          tabindex: "-1",
+        },
+        key: 1,
+      },
+      []
     ),
-    api_element("a", stc1, stc0),
     api_custom_element(
       "ns-bar",
       _nsBar,
       {
-        classMap: stc2,
-        attrs: stc3,
+        classMap: {
+          r: true,
+        },
+        attrs: {
+          "data-xx": "foo",
+        },
         props: {
           ariaDescribedBy: api_scoped_id("ns-foo"),
           ariaHidden: "hidden",
@@ -74,35 +55,59 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 2,
       },
-      stc0
+      []
     ),
-    api_element("svg", stc4, [
-      api_element(
-        "use",
-        {
-          attrs: {
-            "xlink:href": sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "xlink:href",
-              "xx"
-            ),
+    api_element(
+      "svg",
+      {
+        classMap: {
+          cubano: true,
+        },
+        attrs: {
+          focusable: "true",
+        },
+        key: 3,
+        svg: true,
+      },
+      [
+        api_element(
+          "use",
+          {
+            attrs: {
+              "xlink:href": sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "xlink:href",
+                "xx"
+              ),
+            },
+            key: 4,
+            svg: true,
           },
-          key: 4,
-          svg: true,
+          []
+        ),
+      ]
+    ),
+    api_element(
+      "table",
+      {
+        attrs: {
+          bgcolor: "x",
         },
-        stc0
-      ),
-    ]),
-    api_element("table", stc5, stc0),
+        key: 5,
+      },
+      []
+    ),
     api_element(
       "div",
       {
         className: $cmp.foo,
-        attrs: stc6,
+        attrs: {
+          "aria-hidden": "hidden",
+        },
         key: 6,
       },
-      stc0
+      []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/false-value/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/false-value/expected.js
index bdbdbe8674..663282da37 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/false-value/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/false-value/expected.js
@@ -1,30 +1,41 @@
 import _xFoo from "x/foo";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  props: {
-    spellcheck: false,
-  },
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  props: {
-    spellcheck: false,
-  },
-  key: 1,
-};
-const stc3 = {
-  props: {
-    spellcheck: false,
-  },
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { c: api_custom_element } = $api;
   return [
-    api_custom_element("x-foo", _xFoo, stc0, stc1),
-    api_custom_element("x-foo", _xFoo, stc2, stc1),
-    api_custom_element("x-foo", _xFoo, stc3, stc1),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          spellcheck: false,
+        },
+        key: 0,
+      },
+      []
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          spellcheck: false,
+        },
+        key: 1,
+      },
+      []
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          spellcheck: false,
+        },
+        key: 2,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/truthy-value/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/truthy-value/expected.js
index 600a1e36bb..714494b2a8 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/truthy-value/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/spellcheck/static/truthy-value/expected.js
@@ -1,30 +1,41 @@
 import _xFoo from "x/foo";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  props: {
-    spellcheck: true,
-  },
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  props: {
-    spellcheck: true,
-  },
-  key: 1,
-};
-const stc3 = {
-  props: {
-    spellcheck: true,
-  },
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { c: api_custom_element } = $api;
   return [
-    api_custom_element("x-foo", _xFoo, stc0, stc1),
-    api_custom_element("x-foo", _xFoo, stc2, stc1),
-    api_custom_element("x-foo", _xFoo, stc3, stc1),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          spellcheck: true,
+        },
+        key: 0,
+      },
+      []
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          spellcheck: true,
+        },
+        key: 1,
+      },
+      []
+    ),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        props: {
+          spellcheck: true,
+        },
+        key: 2,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/style/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/style/expected.js
index 1d865a0b92..b4096c8731 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/style/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/style/expected.js
@@ -1,51 +1,71 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  styleDecls: [["color", "blue", false]],
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  styleDecls: [["color", "blue", false]],
-  key: 1,
-};
-const stc3 = {
-  styleDecls: [["color", "blue", false]],
-  key: 2,
-};
-const stc4 = {
-  styleDecls: [["box-shadow", "10px 5px 5px black", false]],
-  key: 3,
-};
-const stc5 = {
-  styleDecls: [
-    ["font-size", "12px", false],
-    ["background", "blue", false],
-    ["color", "red", false],
-  ],
-  key: 4,
-};
-const stc6 = {
-  styleDecls: [
-    ["font-size", "12px", false],
-    ["background", "blue", false],
-    ["color", "red", false],
-  ],
-  key: 5,
-};
-const stc7 = {
-  styleDecls: [["background-color", "rgba(255,0,0,0.3)", false]],
-  key: 6,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("div", stc0, stc1),
-    api_element("div", stc2, stc1),
-    api_element("div", stc3, stc1),
-    api_element("div", stc4, stc1),
-    api_element("div", stc5, stc1),
-    api_element("div", stc6, stc1),
-    api_element("div", stc7, stc1),
+    api_element(
+      "div",
+      {
+        styleDecls: [["color", "blue", false]],
+        key: 0,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        styleDecls: [["color", "blue", false]],
+        key: 1,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        styleDecls: [["color", "blue", false]],
+        key: 2,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        styleDecls: [["box-shadow", "10px 5px 5px black", false]],
+        key: 3,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        styleDecls: [
+          ["font-size", "12px", false],
+          ["background", "blue", false],
+          ["color", "red", false],
+        ],
+        key: 4,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        styleDecls: [
+          ["font-size", "12px", false],
+          ["background", "blue", false],
+          ["color", "red", false],
+        ],
+        key: 5,
+      },
+      []
+    ),
+    api_element(
+      "div",
+      {
+        styleDecls: [["background-color", "rgba(255,0,0,0.3)", false]],
+        key: 6,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/tabindex-computed/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/tabindex-computed/expected.js
index 190291324e..020589f9c0 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/tabindex-computed/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/tabindex-computed/expected.js
@@ -1,6 +1,5 @@
 import _xFoo from "x/foo";
 import { registerTemplate } from "lwc";
-const stc0 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     ti: api_tab_index,
@@ -28,7 +27,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         },
         key: 1,
       },
-      stc0
+      []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/unknown-html-tag-known-attribute/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/unknown-html-tag-known-attribute/expected.js
index 07692efff7..b517e8c010 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/unknown-html-tag-known-attribute/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/unknown-html-tag-known-attribute/expected.js
@@ -1,14 +1,18 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    min: "4",
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("somefancytag", stc0, stc1)];
+  return [
+    api_element(
+      "somefancytag",
+      {
+        attrs: {
+          min: "4",
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/class/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/class/expected.js
index 293f72c660..670f6287c3 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/class/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/class/expected.js
@@ -1,16 +1,20 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  classMap: {
-    foo: true,
-    bar: true,
-    "baz-fiz": true,
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("section", stc0, stc1)];
+  return [
+    api_element(
+      "section",
+      {
+        classMap: {
+          foo: true,
+          bar: true,
+          "baz-fiz": true,
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-expression/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-expression/expected.js
index dd241a7b38..1dd34ab7de 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-expression/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-expression/expected.js
@@ -1,5 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
@@ -9,7 +8,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
         style: $cmp.customStyle,
         key: 0,
       },
-      stc0
+      []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-important/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-important/expected.js
index ab0d4d165b..7a75c2e696 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-important/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-important/expected.js
@@ -1,16 +1,20 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  styleDecls: [
-    ["background", "blue", true],
-    ["color", "red", false],
-    ["opacity", "0.5", true],
-  ],
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("div", stc0, stc1)];
+  return [
+    api_element(
+      "div",
+      {
+        styleDecls: [
+          ["background", "blue", true],
+          ["color", "red", false],
+          ["opacity", "0.5", true],
+        ],
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-static/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-static/expected.js
index e2a166b549..d89a3d0484 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-static/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/style-static/expected.js
@@ -1,25 +1,30 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  styleDecls: [
-    ["font-size", "12px", false],
-    ["color", "red", false],
-    ["margin", "10px 5px 10px", false],
-  ],
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  styleDecls: [
-    ["--my-color", "blue", false],
-    ["color", "var(--my-color)", false],
-  ],
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("section", stc0, stc1),
-    api_element("section", stc2, stc1),
+    api_element(
+      "section",
+      {
+        styleDecls: [
+          ["font-size", "12px", false],
+          ["color", "red", false],
+          ["margin", "10px 5px 10px", false],
+        ],
+        key: 0,
+      },
+      []
+    ),
+    api_element(
+      "section",
+      {
+        styleDecls: [
+          ["--my-color", "blue", false],
+          ["color", "var(--my-color)", false],
+        ],
+        key: 1,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg-with-iteration/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg-with-iteration/expected.js
index 6acd201fcf..917da9f02e 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg-with-iteration/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg-with-iteration/expected.js
@@ -1,15 +1,13 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-  svg: true,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { k: api_key, h: api_element, i: api_iterator } = $api;
   return [
     api_element(
       "svg",
-      stc0,
+      {
+        key: 0,
+        svg: true,
+      },
       api_iterator($cmp.lines, function (line) {
         return api_element(
           "line",
@@ -23,7 +21,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
             key: api_key(1, line.key),
             svg: true,
           },
-          stc1
+          []
         );
       })
     ),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg/expected.js
index 5bb9b8227d..272f3fa847 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/svg/expected.js
@@ -1,37 +1,39 @@
 import { registerTemplate, sanitizeAttribute } from "lwc";
-const stc0 = {
-  classMap: {
-    "slds-button__icon": true,
-  },
-  attrs: {
-    viewBox: "0 0 5 5",
-    "aria-hidden": "true",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element(
-        "use",
-        {
-          attrs: {
-            "xlink:href": sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "xlink:href",
-              "/x"
-            ),
-          },
-          key: 1,
-          svg: true,
+    api_element(
+      "svg",
+      {
+        classMap: {
+          "slds-button__icon": true,
+        },
+        attrs: {
+          viewBox: "0 0 5 5",
+          "aria-hidden": "true",
         },
-        stc1
-      ),
-    ]),
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "use",
+          {
+            attrs: {
+              "xlink:href": sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "xlink:href",
+                "/x"
+              ),
+            },
+            key: 1,
+            svg: true,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/template/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/template/expected.js
index 4c58fe1239..5baa396d25 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/base/template/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/base/template/expected.js
@@ -1,10 +1,15 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
-  return [api_element("p", stc0, [api_text("Root")])];
+  return [
+    api_element(
+      "p",
+      {
+        key: 0,
+      },
+      [api_text("Root")]
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/basic/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/basic/expected.js
index 06a0a3f5b7..ad9d1cc046 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/basic/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/basic/expected.js
@@ -1,12 +1,15 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { co: api_comment, t: api_text, h: api_element } = $api;
   return [
     api_comment(" This is an HTML comment "),
-    api_element("button", stc0, [api_text("click me")]),
+    api_element(
+      "button",
+      {
+        key: 0,
+      },
+      [api_text("click me")]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-for-each/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-for-each/expected.js
index ff8862c86b..bf641bea79 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-for-each/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-for-each/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     co: api_comment,
@@ -14,7 +11,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "ul",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.colors, function (color) {
         return [
           api_comment(" color "),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-if/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-if/expected.js
index d77126253a..c68d6ae61e 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-if/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/directive-if/expected.js
@@ -1,18 +1,26 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { co: api_comment, t: api_text, h: api_element } = $api;
   return [
     $cmp.truthyValue ? api_comment(" HTML comment inside if:true ") : null,
-    $cmp.truthyValue ? api_element("p", stc0, [api_text("true branch")]) : null,
+    $cmp.truthyValue
+      ? api_element(
+          "p",
+          {
+            key: 0,
+          },
+          [api_text("true branch")]
+        )
+      : null,
     !$cmp.truthyValue ? api_comment(" HTML comment inside if:false ") : null,
     !$cmp.truthyValue
-      ? api_element("p", stc1, [api_text("false branch")])
+      ? api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("false branch")]
+        )
       : null,
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/preserve-html-comments-option/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/preserve-html-comments-option/expected.js
index 06a0a3f5b7..ad9d1cc046 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/preserve-html-comments-option/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/preserve-html-comments-option/expected.js
@@ -1,12 +1,15 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { co: api_comment, t: api_text, h: api_element } = $api;
   return [
     api_comment(" This is an HTML comment "),
-    api_element("button", stc0, [api_text("click me")]),
+    api_element(
+      "button",
+      {
+        key: 0,
+      },
+      [api_text("click me")]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/slots/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/slots/expected.js
index ee766585e8..93b4b6ab9e 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/slots/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/comments/slots/expected.js
@@ -1,11 +1,5 @@
 import _xChild from "x/child";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     co: api_comment,
@@ -14,10 +8,23 @@ function tmpl($api, $cmp, $slotset, $ctx) {
     c: api_custom_element,
   } = $api;
   return [
-    api_custom_element("x-child", _xChild, stc0, [
-      api_comment(" HTML comment inside slot "),
-      api_element("p", stc1, [api_text("slot content")]),
-    ]),
+    api_custom_element(
+      "x-child",
+      _xChild,
+      {
+        key: 0,
+      },
+      [
+        api_comment(" HTML comment inside slot "),
+        api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("slot content")]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/flatten-child/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/flatten-child/expected.js
index 6b894ddd06..f01e90801b 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/flatten-child/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/flatten-child/expected.js
@@ -1,11 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     t: api_text,
@@ -14,8 +7,21 @@ function tmpl($api, $cmp, $slotset, $ctx) {
     f: api_flatten,
   } = $api;
   return api_flatten([
-    api_element("div", stc0, [api_text("sibling")]),
-    api_dynamic_component("x-foo", $cmp.trackedProp.foo, stc1, stc2),
+    api_element(
+      "div",
+      {
+        key: 0,
+      },
+      [api_text("sibling")]
+    ),
+    api_dynamic_component(
+      "x-foo",
+      $cmp.trackedProp.foo,
+      {
+        key: 1,
+      },
+      []
+    ),
   ]);
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/only-child/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/only-child/expected.js
index c7aef74f9f..54c41016f9 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/only-child/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-dynamic/only-child/expected.js
@@ -1,12 +1,15 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { dc: api_dynamic_component, f: api_flatten } = $api;
   return api_flatten([
-    api_dynamic_component("x-foo", $cmp.trackedProp.foo, stc0, stc1),
+    api_dynamic_component(
+      "x-foo",
+      $cmp.trackedProp.foo,
+      {
+        key: 0,
+      },
+      []
+    ),
   ]);
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/children/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/children/expected.js
index 20696d0a81..da151ef720 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/children/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/children/expected.js
@@ -1,41 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  classMap: {
-    s1: true,
-  },
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  classMap: {
-    s2: true,
-  },
-  key: 2,
-};
-const stc3 = [];
-const stc4 = {
-  classMap: {
-    s3: true,
-  },
-  key: 5,
-};
-const stc5 = {
-  key: 6,
-};
-const stc6 = {
-  classMap: {
-    s4: true,
-  },
-  key: 8,
-};
-const stc7 = {
-  key: 9,
-};
-const stc8 = {
-  key: 10,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     t: api_text,
@@ -47,18 +10,34 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        classMap: {
+          s1: true,
+        },
+        key: 0,
+      },
       api_flatten([
         api_text("Other Child"),
         api_iterator($cmp.items, function (item) {
           return api_text("X");
         }),
-        api_element("p", stc1, [api_text("Last child")]),
+        api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("Last child")]
+        ),
       ])
     ),
     api_element(
       "section",
-      stc2,
+      {
+        classMap: {
+          s2: true,
+        },
+        key: 2,
+      },
       api_flatten([
         api_text("Other Child"),
         $cmp.isTrue
@@ -80,29 +59,61 @@ function tmpl($api, $cmp, $slotset, $ctx) {
                 ),
               ];
             })
-          : stc3,
+          : [],
       ])
     ),
     api_element(
       "section",
-      stc4,
+      {
+        classMap: {
+          s3: true,
+        },
+        key: 5,
+      },
       api_flatten([
-        api_element("p", stc5, [api_text("Last child")]),
+        api_element(
+          "p",
+          {
+            key: 6,
+          },
+          [api_text("Last child")]
+        ),
         api_iterator($cmp.items, function (item) {
           return api_element(
             "div",
             {
               key: api_key(7, item.id),
             },
-            stc3
+            []
           );
         }),
       ])
     ),
-    api_element("section", stc6, [
-      api_element("p", stc7, [api_text("Other child1")]),
-      api_element("p", stc8, [api_text("Other child2")]),
-    ]),
+    api_element(
+      "section",
+      {
+        classMap: {
+          s4: true,
+        },
+        key: 8,
+      },
+      [
+        api_element(
+          "p",
+          {
+            key: 9,
+          },
+          [api_text("Other child1")]
+        ),
+        api_element(
+          "p",
+          {
+            key: 10,
+          },
+          [api_text("Other child2")]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/foreach-with-if/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/foreach-with-if/expected.js
index f1085a4ad7..dfef037cc3 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/foreach-with-if/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/foreach-with-if/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return $cmp.showItems
           ? api_element(
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-index/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-index/expected.js
index e6c2651495..7ab5c7d664 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-index/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-index/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "ul",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item, index) {
         return api_element(
           "li",
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-item/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-item/expected.js
index fd8cf12567..48ce4995aa 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-item/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-item/expected.js
@@ -1,13 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  "my-list": true,
-};
-const stc2 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -19,15 +10,27 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_element(
           "div",
           {
-            classMap: stc1,
+            classMap: {
+              "my-list": true,
+            },
             key: api_key(1, item.id),
           },
-          [api_element("p", stc2, [api_text(api_dynamic_text(item))])]
+          [
+            api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text(api_dynamic_text(item))]
+            ),
+          ]
         );
       })
     ),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-outside-scope-reference/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-outside-scope-reference/expected.js
index 40ef06c475..7492470187 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-outside-scope-reference/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-outside-scope-reference/expected.js
@@ -1,16 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  "my-list": true,
-};
-const stc2 = {
-  key: 2,
-};
-const stc3 = {
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -22,17 +10,33 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_element(
           "div",
           {
-            classMap: stc1,
+            classMap: {
+              "my-list": true,
+            },
             key: api_key(1, item.id),
           },
           [
-            api_element("p", stc2, [api_text(api_dynamic_text(item))]),
-            api_element("p", stc3, [api_text(api_dynamic_text($cmp.item2))]),
+            api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text(api_dynamic_text(item))]
+            ),
+            api_element(
+              "p",
+              {
+                key: 3,
+              },
+              [api_text(api_dynamic_text($cmp.item2))]
+            ),
           ]
         );
       })
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-refence-item/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-refence-item/expected.js
index 75cb2870ab..c6060688fc 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-refence-item/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-refence-item/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "ul",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_element(
           "li",
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-sibling/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-sibling/expected.js
index 6a01aad59c..2e5d1481bd 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-sibling/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline-sibling/expected.js
@@ -1,10 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -17,7 +11,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "ul",
-      stc0,
+      {
+        key: 0,
+      },
       api_flatten([
         api_iterator($cmp.items, function (item) {
           return api_element(
@@ -29,7 +25,13 @@ function tmpl($api, $cmp, $slotset, $ctx) {
             [api_text(api_dynamic_text(item))]
           );
         }),
-        api_element("li", stc1, [api_text("Last")]),
+        api_element(
+          "li",
+          {
+            key: 2,
+          },
+          [api_text("Last")]
+        ),
       ])
     ),
   ];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline/expected.js
index 197edf0ccd..e1a71a6584 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/inline/expected.js
@@ -1,27 +1,30 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  "my-list": true,
-};
-const stc2 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { k: api_key, t: api_text, h: api_element, i: api_iterator } = $api;
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_element(
           "div",
           {
-            classMap: stc1,
+            classMap: {
+              "my-list": true,
+            },
             key: api_key(1, item.id),
           },
-          [api_element("p", stc2, [api_text("items")])]
+          [
+            api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text("items")]
+            ),
+          ]
         );
       })
     ),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-multiple-children/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-multiple-children/expected.js
index 3754834ce9..f215439aff 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-multiple-children/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-multiple-children/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return [
           api_element(
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-outside-scope-reference/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-outside-scope-reference/expected.js
index 8685a0e940..98a20bf40c 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-outside-scope-reference/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-outside-scope-reference/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return [
           api_element(
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-sibling/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-sibling/expected.js
index 8ce883c93b..a1c0e7dadc 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-sibling/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template-sibling/expected.js
@@ -1,10 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -17,7 +11,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_flatten([
         api_iterator($cmp.items, function (item) {
           return [
@@ -37,7 +33,13 @@ function tmpl($api, $cmp, $slotset, $ctx) {
             ),
           ];
         }),
-        api_element("p", stc1, [api_text("3" + api_dynamic_text($cmp.item))]),
+        api_element(
+          "p",
+          {
+            key: 3,
+          },
+          [api_text("3" + api_dynamic_text($cmp.item))]
+        ),
       ])
     ),
   ];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template/expected.js
index 651d356c86..45ec7e5d99 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-for-each/template/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_element(
           "p",
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-multiple/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-multiple/expected.js
index c3793e6410..910e398e05 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-multiple/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-multiple/expected.js
@@ -1,24 +1,42 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
-const stc3 = {
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      $cmp.isTrue ? api_element("p", stc1, [api_text("1")]) : null,
-      $cmp.isTrue ? api_element("p", stc2, [api_text("2")]) : null,
-      $cmp.isTrue ? api_element("p", stc3, [api_text("3")]) : null,
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        $cmp.isTrue
+          ? api_element(
+              "p",
+              {
+                key: 1,
+              },
+              [api_text("1")]
+            )
+          : null,
+        $cmp.isTrue
+          ? api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text("2")]
+            )
+          : null,
+        $cmp.isTrue
+          ? api_element(
+              "p",
+              {
+                key: 3,
+              },
+              [api_text("3")]
+            )
+          : null,
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-sibling-static/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-sibling-static/expected.js
index ac2a3bf4a9..60c4fb25eb 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-sibling-static/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/inline-sibling-static/expected.js
@@ -1,21 +1,34 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, d: api_dynamic_text } = $api;
   return [
-    api_element("section", stc0, [
-      $cmp.isTrue ? api_element("p", stc1, [api_text("1")]) : null,
-      api_text(api_dynamic_text($cmp.foo)),
-      $cmp.isTrue ? api_element("p", stc2, [api_text("3")]) : null,
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        $cmp.isTrue
+          ? api_element(
+              "p",
+              {
+                key: 1,
+              },
+              [api_text("1")]
+            )
+          : null,
+        api_text(api_dynamic_text($cmp.foo)),
+        $cmp.isTrue
+          ? api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text("3")]
+            )
+          : null,
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/strict-true/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/strict-true/expected.js
index 20cfb45308..1a1fa09c40 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/strict-true/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/strict-true/expected.js
@@ -1,16 +1,24 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      $cmp.isTrue === true ? api_element("p", stc1, [api_text("1")]) : null,
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        $cmp.isTrue === true
+          ? api_element(
+              "p",
+              {
+                key: 1,
+              },
+              [api_text("1")]
+            )
+          : null,
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-expression/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-expression/expected.js
index 42ee169774..3091813edc 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-expression/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-expression/expected.js
@@ -1,17 +1,20 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { d: api_dynamic_text, t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      $cmp.state.isTrue
-        ? api_text(
-            api_dynamic_text($cmp.foo) + " " + api_dynamic_text($cmp.bar)
-          )
-        : null,
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        $cmp.state.isTrue
+          ? api_text(
+              api_dynamic_text($cmp.foo) + " " + api_dynamic_text($cmp.bar)
+            )
+          : null,
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-if-else/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-if-else/expected.js
index 7d131f7cc1..64e28d561c 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-if-else/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-if-else/expected.js
@@ -1,15 +1,25 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    $cmp.isTrue ? api_element("p", stc0, [api_text("1")]) : null,
-    !$cmp.isTrue2 ? api_element("p", stc1, [api_text("2")]) : null,
+    $cmp.isTrue
+      ? api_element(
+          "p",
+          {
+            key: 0,
+          },
+          [api_text("1")]
+        )
+      : null,
+    !$cmp.isTrue2
+      ? api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("2")]
+        )
+      : null,
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-multiple/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-multiple/expected.js
index fcd98d3c6d..c2268b9516 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-multiple/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-multiple/expected.js
@@ -1,19 +1,34 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    $cmp.isTrue ? api_element("p", stc0, [api_text("1")]) : null,
-    $cmp.isTrue ? api_element("p", stc1, [api_text("2")]) : null,
-    $cmp.isTrue ? api_element("p", stc2, [api_text("3")]) : null,
+    $cmp.isTrue
+      ? api_element(
+          "p",
+          {
+            key: 0,
+          },
+          [api_text("1")]
+        )
+      : null,
+    $cmp.isTrue
+      ? api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("2")]
+        )
+      : null,
+    $cmp.isTrue
+      ? api_element(
+          "p",
+          {
+            key: 2,
+          },
+          [api_text("3")]
+        )
+      : null,
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-sibiling/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-sibiling/expected.js
index fb96c1521f..5230139be6 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-sibiling/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template-sibiling/expected.js
@@ -1,24 +1,38 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
-const stc3 = {
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      api_element("p", stc1, [api_text("1")]),
-      $cmp.bar ? api_element("p", stc2, [api_text("2")]) : null,
-      api_element("p", stc3, [api_text("3")]),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("1")]
+        ),
+        $cmp.bar
+          ? api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text("2")]
+            )
+          : null,
+        api_element(
+          "p",
+          {
+            key: 3,
+          },
+          [api_text("3")]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template/expected.js
index f5e9ccfd1f..0658a86771 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-if/template/expected.js
@@ -1,17 +1,20 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { d: api_dynamic_text, t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      $cmp.isTrue
-        ? api_text(
-            api_dynamic_text($cmp.foo) + " " + api_dynamic_text($cmp.bar)
-          )
-        : null,
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        $cmp.isTrue
+          ? api_text(
+              api_dynamic_text($cmp.foo) + " " + api_dynamic_text($cmp.bar)
+            )
+          : null,
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/usage-if-for-each/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/usage-if-for-each/expected.js
index c5dfcab292..db9da73490 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/usage-if-for-each/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/usage-if-for-each/expected.js
@@ -1,17 +1,5 @@
 import _aB from "a/b";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  classMap: {
-    s2: true,
-  },
-  key: 0,
-};
-const stc1 = {
-  lwc: {
-    dom: "manual",
-  },
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     shc: api_sanitize_html_content,
@@ -25,7 +13,12 @@ function tmpl($api, $cmp, $slotset, $ctx) {
     api_custom_element(
       "a-b",
       _aB,
-      stc0,
+      {
+        classMap: {
+          s2: true,
+        },
+        key: 0,
+      },
       api_flatten([
         $cmp.isTrue
           ? api_element(
@@ -39,10 +32,14 @@ function tmpl($api, $cmp, $slotset, $ctx) {
                         ))
                       : $ctx._sanitizedHtml$0,
                 },
-                context: stc1,
+                context: {
+                  lwc: {
+                    dom: "manual",
+                  },
+                },
                 key: 1,
               },
-              stc2
+              []
             )
           : null,
         api_iterator($cmp.items, function (item) {
@@ -57,10 +54,14 @@ function tmpl($api, $cmp, $slotset, $ctx) {
                       ))
                     : $ctx._sanitizedHtml$1,
               },
-              context: stc1,
+              context: {
+                lwc: {
+                  dom: "manual",
+                },
+              },
               key: api_key(2, item.id),
             },
-            stc2
+            []
           );
         }),
       ])
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/valid/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/valid/expected.js
index 9e255fe096..4c31a4f22b 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/valid/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-inner-html/valid/expected.js
@@ -1,10 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  lwc: {
-    dom: "manual",
-  },
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { shc: api_sanitize_html_content, h: api_element } = $api;
   return [
@@ -18,10 +12,14 @@ function tmpl($api, $cmp, $slotset, $ctx) {
               "Hello <b>world</b>!"
             )),
         },
-        context: stc0,
+        context: {
+          lwc: {
+            dom: "manual",
+          },
+        },
         key: 0,
       },
-      stc1
+      []
     ),
     api_element(
       "div",
@@ -34,10 +32,14 @@ function tmpl($api, $cmp, $slotset, $ctx) {
                 ))
               : $ctx._sanitizedHtml$1,
         },
-        context: stc0,
+        context: {
+          lwc: {
+            dom: "manual",
+          },
+        },
         key: 1,
       },
-      stc1
+      []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-iterator/iterator/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-iterator/iterator/expected.js
index ae72c50270..301d6180dd 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-iterator/iterator/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-iterator/iterator/expected.js
@@ -1,10 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -16,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (xValue, xIndex, xFirst, xLast) {
         const x = {
           value: xValue,
@@ -34,9 +30,13 @@ function tmpl($api, $cmp, $slotset, $ctx) {
             key: api_key(1, x.value.id),
           },
           [
-            api_element("span", stc1, [
-              api_text("Row: " + api_dynamic_text(x.index)),
-            ]),
+            api_element(
+              "span",
+              {
+                key: 2,
+              },
+              [api_text("Row: " + api_dynamic_text(x.index))]
+            ),
             api_text(". Value: " + api_dynamic_text(x.value)),
           ]
         );
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/component/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/component/expected.js
index f682aac8f0..af8406e957 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/component/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/component/expected.js
@@ -1,8 +1,5 @@
 import _nsItem from "ns/item";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -15,7 +12,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "ul",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_custom_element(
           "ns-item",
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/element/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/element/expected.js
index 58d0e5714f..ab5e5fc6d3 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/element/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/element/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "ul",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_element(
           "li",
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/for-each/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/for-each/expected.js
index fd8cf12567..48ce4995aa 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/for-each/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/for-each/expected.js
@@ -1,13 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  "my-list": true,
-};
-const stc2 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -19,15 +10,27 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return api_element(
           "div",
           {
-            classMap: stc1,
+            classMap: {
+              "my-list": true,
+            },
             key: api_key(1, item.id),
           },
-          [api_element("p", stc2, [api_text(api_dynamic_text(item))])]
+          [
+            api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text(api_dynamic_text(item))]
+            ),
+          ]
         );
       })
     ),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-identifier/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-identifier/expected.js
index 7c52423714..e8c112a1da 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-identifier/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-identifier/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (xValue, xIndex, xFirst, xLast) {
         const x = {
           value: xValue,
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-member-expression/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-member-expression/expected.js
index 5965b8e127..332e051d02 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-member-expression/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-key-member-expression/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (xValue, xIndex, xFirst, xLast) {
         const x = {
           value: xValue,
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-value-as-key/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-value-as-key/expected.js
index 921b2c8834..a8a869aa8d 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-value-as-key/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/iterator-value-as-key/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (xValue, xIndex, xFirst, xLast) {
         const x = {
           value: xValue,
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/nested-iterator-if/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/nested-iterator-if/expected.js
index 4e1dd3046e..a1243adf67 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/nested-iterator-if/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/nested-iterator-if/expected.js
@@ -1,10 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -16,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (xValue, xIndex, xFirst, xLast) {
         const x = {
           value: xValue,
@@ -35,9 +31,13 @@ function tmpl($api, $cmp, $slotset, $ctx) {
               key: api_key(1, x.value.id),
             },
             [
-              api_element("span", stc1, [
-                api_text("Row: " + api_dynamic_text(x.index)),
-              ]),
+              api_element(
+                "span",
+                {
+                  key: 2,
+                },
+                [api_text("Row: " + api_dynamic_text(x.index))]
+              ),
               api_text(". Value: " + api_dynamic_text(x.value)),
             ]
           ),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/outside-iterator/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/outside-iterator/expected.js
index 14c6b88fb0..2505a3928b 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/outside-iterator/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-key/outside-iterator/expected.js
@@ -1,5 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { k: api_key, h: api_element } = $api;
   return [
@@ -8,7 +7,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       {
         key: api_key(0, $cmp.keyGetter),
       },
-      stc0
+      []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/shadow-template/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/shadow-template/expected.js
index 4c58fe1239..5baa396d25 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/shadow-template/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/shadow-template/expected.js
@@ -1,10 +1,15 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
-  return [api_element("p", stc0, [api_text("Root")])];
+  return [
+    api_element(
+      "p",
+      {
+        key: 0,
+      },
+      [api_text("Root")]
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/template/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/template/expected.js
index 7fde6d0481..4521ad4b0d 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/template/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/directive-render-mode/template/expected.js
@@ -1,22 +1,33 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  attrs: {
-    name: "named",
-  },
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, s: api_slot, f: api_flatten } = $api;
   return api_flatten([
-    api_element("p", stc0, [api_text("Root")]),
-    api_slot("", stc1, [api_text("Default")], $slotset),
-    api_slot("named", stc2, [api_text("Named")], $slotset),
+    api_element(
+      "p",
+      {
+        key: 0,
+      },
+      [api_text("Root")]
+    ),
+    api_slot(
+      "",
+      {
+        key: 1,
+      },
+      [api_text("Default")],
+      $slotset
+    ),
+    api_slot(
+      "named",
+      {
+        attrs: {
+          name: "named",
+        },
+        key: 2,
+      },
+      [api_text("Named")],
+      $slotset
+    ),
   ]);
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/events/component/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/events/component/expected.js
index 5120597205..fcda7ca919 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/events/component/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/events/component/expected.js
@@ -1,26 +1,28 @@
 import _nsFoo from "ns/foo";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { b: api_bind, c: api_custom_element, h: api_element } = $api;
   const { _m0 } = $ctx;
   return [
-    api_element("section", stc0, [
-      api_custom_element(
-        "ns-foo",
-        _nsFoo,
-        {
-          key: 1,
-          on: {
-            foo: _m0 || ($ctx._m0 = api_bind($cmp.handleFoo)),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_custom_element(
+          "ns-foo",
+          _nsFoo,
+          {
+            key: 1,
+            on: {
+              foo: _m0 || ($ctx._m0 = api_bind($cmp.handleFoo)),
+            },
           },
-        },
-        stc1
-      ),
-    ]),
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/events/tag/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/events/tag/expected.js
index fc619cf0f6..0d3e5aa924 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/events/tag/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/events/tag/expected.js
@@ -1,33 +1,36 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { b: api_bind, t: api_text, h: api_element } = $api;
   const { _m0, _m1 } = $ctx;
   return [
-    api_element("section", stc0, [
-      api_element(
-        "div",
-        {
-          key: 1,
-          on: {
-            click: _m0 || ($ctx._m0 = api_bind($cmp.handleClick)),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "div",
+          {
+            key: 1,
+            on: {
+              click: _m0 || ($ctx._m0 = api_bind($cmp.handleClick)),
+            },
           },
-        },
-        [api_text("x")]
-      ),
-      api_element(
-        "div",
-        {
-          key: 2,
-          on: {
-            press: _m1 || ($ctx._m1 = api_bind($cmp.handlePress)),
+          [api_text("x")]
+        ),
+        api_element(
+          "div",
+          {
+            key: 2,
+            on: {
+              press: _m1 || ($ctx._m1 = api_bind($cmp.handlePress)),
+            },
           },
-        },
-        [api_text("x")]
-      ),
-    ]),
+          [api_text("x")]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-deep/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-deep/expected.js
index 12d52c5771..23e588c969 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-deep/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-deep/expected.js
@@ -1,21 +1,23 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      api_element(
-        "p",
-        {
-          className: $cmp.bar.foo.baz,
-          key: 1,
-        },
-        stc1
-      ),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            className: $cmp.bar.foo.baz,
+            key: 1,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-multiple/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-multiple/expected.js
index effc42d6af..ec95585af8 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-multiple/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute-multiple/expected.js
@@ -1,5 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
@@ -16,7 +15,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
             className: $cmp.bar.c,
             key: 1,
           },
-          stc0
+          []
         ),
       ]
     ),
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute/expected.js
index b585336cc7..a2680e9e0f 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/attribute/expected.js
@@ -1,21 +1,23 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      api_element(
-        "p",
-        {
-          className: $cmp.bar,
-          key: 1,
-        },
-        stc1
-      ),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            className: $cmp.bar,
+            key: 1,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/escaped/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/escaped/expected.js
index 7a7ca49079..90b018be72 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/escaped/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/escaped/expected.js
@@ -1,14 +1,18 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  props: {
-    value: "{value}",
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("input", stc0, stc1)];
+  return [
+    api_element(
+      "input",
+      {
+        props: {
+          value: "{value}",
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/tag/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/tag/expected.js
index 5f6281cd20..96fbd4d78e 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/tag/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/expression/tag/expected.js
@@ -1,10 +1,15 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { d: api_dynamic_text, t: api_text, h: api_element } = $api;
-  return [api_element("p", stc0, [api_text(api_dynamic_text($cmp.text))])];
+  return [
+    api_element(
+      "p",
+      {
+        key: 0,
+      },
+      [api_text(api_dynamic_text($cmp.text))]
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/html-tags/unkown-element/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/html-tags/unkown-element/expected.js
index 43ca39fbfe..d7e13cff71 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/html-tags/unkown-element/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/html-tags/unkown-element/expected.js
@@ -1,28 +1,40 @@
 import _xCustomComponent from "x/customComponent";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  props: {
-    someTruthyValue: true,
-  },
-  key: 1,
-};
-const stc3 = {
-  key: 2,
-};
-const stc4 = {
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element, c: api_custom_element, t: api_text } = $api;
   return [
-    api_element("unknonwtag", stc0, stc1),
-    api_custom_element("x-custom-component", _xCustomComponent, stc2, stc1),
-    api_element("span", stc3, [api_text("valid tags should not warn")]),
-    api_element("spam", stc4, [api_text("this tag has a typo")]),
+    api_element(
+      "unknonwtag",
+      {
+        key: 0,
+      },
+      []
+    ),
+    api_custom_element(
+      "x-custom-component",
+      _xCustomComponent,
+      {
+        props: {
+          someTruthyValue: true,
+        },
+        key: 1,
+      },
+      []
+    ),
+    api_element(
+      "span",
+      {
+        key: 2,
+      },
+      [api_text("valid tags should not warn")]
+    ),
+    api_element(
+      "spam",
+      {
+        key: 3,
+      },
+      [api_text("this tag has a typo")]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/comments/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/comments/expected.js
index 4d6634a3cc..730bc29b7f 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/comments/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/comments/expected.js
@@ -1,16 +1,20 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  context: {
-    lwc: {
-      dom: "manual",
-    },
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("div", stc0, stc1)];
+  return [
+    api_element(
+      "div",
+      {
+        context: {
+          lwc: {
+            dom: "manual",
+          },
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/manual/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/manual/expected.js
index 4d6634a3cc..730bc29b7f 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/manual/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/lwc-dom/manual/expected.js
@@ -1,16 +1,20 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  context: {
-    lwc: {
-      dom: "manual",
-    },
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("div", stc0, stc1)];
+  return [
+    api_element(
+      "div",
+      {
+        context: {
+          lwc: {
+            dom: "manual",
+          },
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/metadata/used-attrs/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/metadata/used-attrs/expected.js
index 9c5f9859f2..f4bdad7dec 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/metadata/used-attrs/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/metadata/used-attrs/expected.js
@@ -1,16 +1,22 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { d: api_dynamic_text, t: api_text, h: api_element } = $api;
   return [
-    api_element("section", stc0, [
-      api_element("p", stc1, [api_text(api_dynamic_text($cmp.obj.sub))]),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text(api_dynamic_text($cmp.obj.sub))]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-default-slot/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-default-slot/expected.js
index a67efd7f9c..0ec5649039 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-default-slot/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-default-slot/expected.js
@@ -1,16 +1,23 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { s: api_slot } = $api;
   return [
-    api_slot("", stc0, stc1, $slotset),
-    api_slot("", stc2, stc1, $slotset),
+    api_slot(
+      "",
+      {
+        key: 0,
+      },
+      [],
+      $slotset
+    ),
+    api_slot(
+      "",
+      {
+        key: 1,
+      },
+      [],
+      $slotset
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-named-slot/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-named-slot/expected.js
index b7da62d0f8..9a9c738d1b 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-named-slot/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/duplicate-named-slot/expected.js
@@ -1,22 +1,29 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    name: "foo",
-  },
-  key: 0,
-};
-const stc1 = [];
-const stc2 = {
-  attrs: {
-    name: "foo",
-  },
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { s: api_slot } = $api;
   return [
-    api_slot("foo", stc0, stc1, $slotset),
-    api_slot("foo", stc2, stc1, $slotset),
+    api_slot(
+      "foo",
+      {
+        attrs: {
+          name: "foo",
+        },
+        key: 0,
+      },
+      [],
+      $slotset
+    ),
+    api_slot(
+      "foo",
+      {
+        attrs: {
+          name: "foo",
+        },
+        key: 1,
+      },
+      [],
+      $slotset
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/multiple-attributes/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/multiple-attributes/expected.js
index f1085a4ad7..dfef037cc3 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/multiple-attributes/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/multiple-attributes/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -13,7 +10,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
   return [
     api_element(
       "section",
-      stc0,
+      {
+        key: 0,
+      },
       api_iterator($cmp.items, function (item) {
         return $cmp.showItems
           ? api_element(
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/single-attribute/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/single-attribute/expected.js
index f492d00435..5c3a8bbc78 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/single-attribute/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/invalid-template-attribute/single-attribute/expected.js
@@ -1,8 +1,7 @@
 import { registerTemplate } from "lwc";
-const stc0 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {} = $api;
-  return stc0;
+  return [];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/named-slot-in-iterator/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/named-slot-in-iterator/expected.js
index e9f5c0d817..080cb4ef40 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/named-slot-in-iterator/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/named-slot-in-iterator/expected.js
@@ -1,11 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    name: "james",
-  },
-  key: 1,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { k: api_key, s: api_slot, h: api_element, i: api_iterator } = $api;
   return api_iterator($cmp.items, function (item) {
@@ -14,7 +7,19 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       {
         key: api_key(0, item),
       },
-      [api_slot("james", stc0, stc1, $slotset)]
+      [
+        api_slot(
+          "james",
+          {
+            attrs: {
+              name: "james",
+            },
+            key: 1,
+          },
+          [],
+          $slotset
+        ),
+      ]
     );
   });
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/slot-in-iterator/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/slot-in-iterator/expected.js
index abd70d1865..d7a68df40f 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/slot-in-iterator/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/parsing-errors/slot-in-iterator/expected.js
@@ -1,8 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 1,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { k: api_key, s: api_slot, h: api_element, i: api_iterator } = $api;
   return api_iterator($cmp.items, function (item) {
@@ -11,7 +7,16 @@ function tmpl($api, $cmp, $slotset, $ctx) {
       {
         key: api_key(0, item),
       },
-      [api_slot("", stc0, stc1, $slotset)]
+      [
+        api_slot(
+          "",
+          {
+            key: 1,
+          },
+          [],
+          $slotset
+        ),
+      ]
     );
   });
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/class-name-slash/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/class-name-slash/expected.js
index d8d80787d7..1f6daac69f 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/class-name-slash/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/class-name-slash/expected.js
@@ -1,18 +1,23 @@
 import _xCmp from "x/cmp";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  classMap: {
-    foo: true,
-  },
-  props: {
-    xClass: "bar",
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { c: api_custom_element } = $api;
-  return [api_custom_element("x-cmp", _xCmp, stc0, stc1)];
+  return [
+    api_custom_element(
+      "x-cmp",
+      _xCmp,
+      {
+        classMap: {
+          foo: true,
+        },
+        props: {
+          xClass: "bar",
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/dashed-html-tag/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/dashed-html-tag/expected.js
index 66256e074a..f927abe6e3 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/dashed-html-tag/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/dashed-html-tag/expected.js
@@ -1,18 +1,25 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    local: "x",
-  },
-  key: 1,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("section", stc0, [api_element("color-profile", stc1, stc2)]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "color-profile",
+          {
+            attrs: {
+              local: "x",
+            },
+            key: 1,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/excaped-json/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/excaped-json/expected.js
index b892309bab..4abf3d3c05 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/excaped-json/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/excaped-json/expected.js
@@ -1,15 +1,20 @@
 import _xTest from "x/test";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  props: {
-    json: '[{"column":"ID","value":"5e","operator":"equals","f":true}]',
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { c: api_custom_element } = $api;
-  return [api_custom_element("x-test", _xTest, stc0, stc1)];
+  return [
+    api_custom_element(
+      "x-test",
+      _xTest,
+      {
+        props: {
+          json: '[{"column":"ID","value":"5e","operator":"equals","f":true}]',
+        },
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/handler-memoization/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/handler-memoization/expected.js
index cd3d509d22..484fec2c3b 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/handler-memoization/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/handler-memoization/expected.js
@@ -1,7 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     b: api_bind,
@@ -25,7 +22,9 @@ function tmpl($api, $cmp, $slotset, $ctx) {
     ),
     api_element(
       "ul",
-      stc0,
+      {
+        key: 1,
+      },
       api_iterator($cmp.list, function (task) {
         return api_element(
           "li",
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/invalid-html-recovery/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/invalid-html-recovery/expected.js
index a350620ea2..80137b8f71 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/invalid-html-recovery/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/invalid-html-recovery/expected.js
@@ -1,16 +1,21 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("h1", stc0, [api_text("hello")]),
-    api_element("br", stc1, stc2),
+    api_element(
+      "h1",
+      {
+        key: 0,
+      },
+      [api_text("hello")]
+    ),
+    api_element(
+      "br",
+      {
+        key: 1,
+      },
+      []
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/nested-if-loops/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/nested-if-loops/expected.js
index ee41782ff7..4a0a0bd2bc 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/nested-if-loops/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/nested-if-loops/expected.js
@@ -1,5 +1,4 @@
 import { registerTemplate } from "lwc";
-const stc0 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     t: api_text,
@@ -21,7 +20,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
           );
         }),
       ])
-    : stc0;
+    : [];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/slot-name-with-dash/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/slot-name-with-dash/expected.js
index e9bd13a8d8..e8812288e6 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/slot-name-with-dash/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/slot-name-with-dash/expected.js
@@ -1,20 +1,24 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    name: "secret-slot",
-  },
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, s: api_slot } = $api;
   return [
     api_slot(
       "secret-slot",
-      stc0,
-      [api_element("p", stc1, [api_text("Test slot content")])],
+      {
+        attrs: {
+          name: "secret-slot",
+        },
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("Test slot content")]
+        ),
+      ],
       $slotset
     ),
   ];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/table-with-tr/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/table-with-tr/expected.js
index 589f5baa60..15bc6ea545 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/table-with-tr/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/regression/table-with-tr/expected.js
@@ -1,20 +1,30 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
-const stc3 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("table", stc0, [
-      api_element("tbody", stc1, [api_element("tr", stc2, stc3)]),
-    ]),
+    api_element(
+      "table",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "tbody",
+          {
+            key: 1,
+          },
+          [
+            api_element(
+              "tr",
+              {
+                key: 2,
+              },
+              []
+            ),
+          ]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/secure/secure-template/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/secure/secure-template/expected.js
index 4f82cf51c4..0c7db845a9 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/secure/secure-template/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/secure/secure-template/expected.js
@@ -1,12 +1,17 @@
 import _xTest from "x/test";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { c: api_custom_element } = $api;
-  return [api_custom_element("x-test", _xTest, stc0, stc1)];
+  return [
+    api_custom_element(
+      "x-test",
+      _xTest,
+      {
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/component-definition/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/component-definition/expected.js
index b662cc2869..13cb6be951 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/component-definition/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/component-definition/expected.js
@@ -1,18 +1,25 @@
 import _xFoo from "x/foo";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { s: api_slot, c: api_custom_element } = $api;
   return [
-    api_custom_element("x-foo", _xFoo, stc0, [
-      api_slot("", stc1, stc2, $slotset),
-    ]),
+    api_custom_element(
+      "x-foo",
+      _xFoo,
+      {
+        key: 0,
+      },
+      [
+        api_slot(
+          "",
+          {
+            key: 1,
+          },
+          [],
+          $slotset
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibiling-slot/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibiling-slot/expected.js
index e15f1ae1b9..e5b096d224 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibiling-slot/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibiling-slot/expected.js
@@ -1,39 +1,50 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    name: "other",
-  },
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
-const stc3 = {
-  key: 3,
-};
-const stc4 = {
-  key: 4,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, s: api_slot } = $api;
   return [
-    api_element("section", stc0, [
-      api_slot(
-        "other",
-        stc1,
-        [api_element("p", stc2, [api_text("Default slot other content")])],
-        $slotset
-      ),
-      api_slot(
-        "",
-        stc3,
-        [api_element("p", stc4, [api_text("Default slot content")])],
-        $slotset
-      ),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_slot(
+          "other",
+          {
+            attrs: {
+              name: "other",
+            },
+            key: 1,
+          },
+          [
+            api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text("Default slot other content")]
+            ),
+          ],
+          $slotset
+        ),
+        api_slot(
+          "",
+          {
+            key: 3,
+          },
+          [
+            api_element(
+              "p",
+              {
+                key: 4,
+              },
+              [api_text("Default slot content")]
+            ),
+          ],
+          $slotset
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibling-static/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibling-static/expected.js
index 49fa342f8b..98dcf29ec5 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibling-static/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition-sibling-static/expected.js
@@ -1,28 +1,38 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
-const stc3 = {
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, s: api_slot } = $api;
   return [
-    api_element("section", stc0, [
-      api_element("p", stc1, [api_text("Sibling")]),
-      api_slot(
-        "",
-        stc2,
-        [api_element("p", stc3, [api_text("Default slot content")])],
-        $slotset
-      ),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("Sibling")]
+        ),
+        api_slot(
+          "",
+          {
+            key: 2,
+          },
+          [
+            api_element(
+              "p",
+              {
+                key: 3,
+              },
+              [api_text("Default slot content")]
+            ),
+          ],
+          $slotset
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition/expected.js
index c8646c45cf..fa280d3a21 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/definition/expected.js
@@ -1,24 +1,31 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, s: api_slot } = $api;
   return [
-    api_element("section", stc0, [
-      api_slot(
-        "",
-        stc1,
-        [api_element("p", stc2, [api_text("Default slot content")])],
-        $slotset
-      ),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_slot(
+          "",
+          {
+            key: 1,
+          },
+          [
+            api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text("Default slot content")]
+            ),
+          ],
+          $slotset
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed-1/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed-1/expected.js
index 50d545bf1d..b37999861a 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed-1/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed-1/expected.js
@@ -1,58 +1,82 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  attrs: {
-    name: "header",
-  },
-  key: 2,
-};
-const stc3 = {
-  key: 3,
-};
-const stc4 = {
-  key: 4,
-};
-const stc5 = {
-  key: 5,
-};
-const stc6 = {
-  key: 6,
-};
-const stc7 = {
-  attrs: {
-    name: "footer",
-  },
-  key: 7,
-};
-const stc8 = {
-  key: 8,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, s: api_slot } = $api;
   return [
-    api_element("section", stc0, [
-      api_element("p", stc1, [api_text("Before header")]),
-      api_slot("header", stc2, [api_text("Default header")], $slotset),
-      api_element("p", stc3, [api_text("In")]),
-      api_element("p", stc4, [api_text("between")]),
-      api_slot(
-        "",
-        stc5,
-        [api_element("p", stc6, [api_text("Default body")])],
-        $slotset
-      ),
-      api_slot(
-        "footer",
-        stc7,
-        [api_element("p", stc8, [api_text("Default footer")])],
-        $slotset
-      ),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "p",
+          {
+            key: 1,
+          },
+          [api_text("Before header")]
+        ),
+        api_slot(
+          "header",
+          {
+            attrs: {
+              name: "header",
+            },
+            key: 2,
+          },
+          [api_text("Default header")],
+          $slotset
+        ),
+        api_element(
+          "p",
+          {
+            key: 3,
+          },
+          [api_text("In")]
+        ),
+        api_element(
+          "p",
+          {
+            key: 4,
+          },
+          [api_text("between")]
+        ),
+        api_slot(
+          "",
+          {
+            key: 5,
+          },
+          [
+            api_element(
+              "p",
+              {
+                key: 6,
+              },
+              [api_text("Default body")]
+            ),
+          ],
+          $slotset
+        ),
+        api_slot(
+          "footer",
+          {
+            attrs: {
+              name: "footer",
+            },
+            key: 7,
+          },
+          [
+            api_element(
+              "p",
+              {
+                key: 8,
+              },
+              [api_text("Default footer")]
+            ),
+          ],
+          $slotset
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed/expected.js
index 7effe28266..7f47bc92e3 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/mixed/expected.js
@@ -1,15 +1,5 @@
 import _xB from "x/b";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
-const stc3 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     h: api_element,
@@ -19,21 +9,37 @@ function tmpl($api, $cmp, $slotset, $ctx) {
     c: api_custom_element,
   } = $api;
   return [
-    api_element("div", stc0, [
-      api_custom_element(
-        "x-b",
-        _xB,
-        stc1,
-        api_flatten([
-          $cmp.isLoading ? api_element("div", stc2, stc3) : null,
-          $cmp.haveLoadedItems
-            ? api_iterator($cmp.menuItems, function (item) {
-                return api_text("x");
-              })
-            : stc3,
-        ])
-      ),
-    ]),
+    api_element(
+      "div",
+      {
+        key: 0,
+      },
+      [
+        api_custom_element(
+          "x-b",
+          _xB,
+          {
+            key: 1,
+          },
+          api_flatten([
+            $cmp.isLoading
+              ? api_element(
+                  "div",
+                  {
+                    key: 2,
+                  },
+                  []
+                )
+              : null,
+            $cmp.haveLoadedItems
+              ? api_iterator($cmp.menuItems, function (item) {
+                  return api_text("x");
+                })
+              : [],
+          ])
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/no-slot/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/no-slot/expected.js
index 8d03df6877..2936925ff1 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/no-slot/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/no-slot/expected.js
@@ -1,12 +1,17 @@
 import _xCmp from "x/cmp";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { c: api_custom_element } = $api;
-  return [api_custom_element("x-cmp", _xCmp, stc0, stc1)];
+  return [
+    api_custom_element(
+      "x-cmp",
+      _xCmp,
+      {
+        key: 0,
+      },
+      []
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if-for-each/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if-for-each/expected.js
index 1cf12a448f..d96d839352 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if-for-each/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if-for-each/expected.js
@@ -1,12 +1,5 @@
 import _aB from "a/b";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  classMap: {
-    s2: true,
-  },
-  key: 0,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const {
     k: api_key,
@@ -19,7 +12,12 @@ function tmpl($api, $cmp, $slotset, $ctx) {
     api_custom_element(
       "a-b",
       _aB,
-      stc0,
+      {
+        classMap: {
+          s2: true,
+        },
+        key: 0,
+      },
       $cmp.isTrue
         ? api_iterator($cmp.items, function (item) {
             return api_element(
@@ -30,7 +28,7 @@ function tmpl($api, $cmp, $slotset, $ctx) {
               [api_text("X")]
             );
           })
-        : stc1
+        : []
     ),
   ];
 }
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if/expected.js
index d5ca9e65ad..5692eeaab1 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-if/expected.js
@@ -1,32 +1,47 @@
 import _nsCmp from "ns/cmp";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  attrs: {
-    slot: "",
-  },
-  key: 2,
-};
-const stc3 = {
-  attrs: {
-    slot: "",
-  },
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, c: api_custom_element } = $api;
   return [
-    api_element("section", stc0, [
-      api_custom_element("ns-cmp", _nsCmp, stc1, [
-        $cmp.isTrue ? api_element("p", stc2, [api_text("S1")]) : null,
-        api_element("p", stc3, [api_text("S2")]),
-      ]),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_custom_element(
+          "ns-cmp",
+          _nsCmp,
+          {
+            key: 1,
+          },
+          [
+            $cmp.isTrue
+              ? api_element(
+                  "p",
+                  {
+                    attrs: {
+                      slot: "",
+                    },
+                    key: 2,
+                  },
+                  [api_text("S1")]
+                )
+              : null,
+            api_element(
+              "p",
+              {
+                attrs: {
+                  slot: "",
+                },
+                key: 3,
+              },
+              [api_text("S2")]
+            ),
+          ]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-named/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-named/expected.js
index f47675d09e..332efa279b 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-named/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage-named/expected.js
@@ -1,27 +1,34 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    name: "test",
-  },
-  key: 1,
-};
-const stc2 = {
-  key: 2,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, s: api_slot } = $api;
   return [
-    api_element("section", stc0, [
-      api_slot(
-        "test",
-        stc1,
-        [api_element("p", stc2, [api_text("Test slot content")])],
-        $slotset
-      ),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_slot(
+          "test",
+          {
+            attrs: {
+              name: "test",
+            },
+            key: 1,
+          },
+          [
+            api_element(
+              "p",
+              {
+                key: 2,
+              },
+              [api_text("Test slot content")]
+            ),
+          ],
+          $slotset
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage/expected.js
index 4f8085bcf9..9ff6b7385f 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/slots/usage/expected.js
@@ -1,32 +1,45 @@
 import _nsCmp from "ns/cmp";
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  key: 1,
-};
-const stc2 = {
-  attrs: {
-    slot: "header",
-  },
-  key: 2,
-};
-const stc3 = {
-  attrs: {
-    slot: "",
-  },
-  key: 3,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element, c: api_custom_element } = $api;
   return [
-    api_element("section", stc0, [
-      api_custom_element("ns-cmp", _nsCmp, stc1, [
-        api_element("p", stc2, [api_text("Header Slot Content")]),
-        api_element("p", stc3, [api_text("Default Content")]),
-      ]),
-    ]),
+    api_element(
+      "section",
+      {
+        key: 0,
+      },
+      [
+        api_custom_element(
+          "ns-cmp",
+          _nsCmp,
+          {
+            key: 1,
+          },
+          [
+            api_element(
+              "p",
+              {
+                attrs: {
+                  slot: "header",
+                },
+                key: 2,
+              },
+              [api_text("Header Slot Content")]
+            ),
+            api_element(
+              "p",
+              {
+                attrs: {
+                  slot: "",
+                },
+                key: 3,
+              },
+              [api_text("Default Content")]
+            ),
+          ]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/filter/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/filter/expected.js
index 5ff43f9f01..90ad07028d 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/filter/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/filter/expected.js
@@ -1,511 +1,641 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    width: "400",
-    height: "400",
-    xmlns: "http://www.w3.org/2000/svg",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = {
-  key: 1,
-  svg: true,
-};
-const stc2 = {
-  attrs: {
-    x: "25%",
-    y: "25%",
-    width: "50%",
-    height: "50%",
-    "flood-color": "green",
-    "flood-opacity": "0.75",
-  },
-  key: 3,
-  svg: true,
-};
-const stc3 = [];
-const stc4 = {
-  attrs: {
-    x: "25%",
-    y: "25%",
-    width: "50%",
-    height: "50%",
-    in2: "SourceGraphic",
-    mode: "multiply",
-  },
-  key: 5,
-  svg: true,
-};
-const stc5 = {
-  attrs: {
-    x: "25%",
-    y: "25%",
-    width: "50%",
-    height: "50%",
-  },
-  key: 7,
-  svg: true,
-};
-const stc6 = {
-  attrs: {
-    in: "SourceGraphic",
-  },
-  key: 8,
-  svg: true,
-};
-const stc7 = {
-  attrs: {
-    in: "FillPaint",
-  },
-  key: 9,
-  svg: true,
-};
-const stc8 = {
-  attrs: {
-    fill: "none",
-    stroke: "blue",
-    "stroke-width": "4",
-  },
-  key: 10,
-  svg: true,
-};
-const stc9 = {
-  attrs: {
-    width: "200",
-    height: "200",
-  },
-  key: 11,
-  svg: true,
-};
-const stc10 = {
-  attrs: {
-    x2: "200",
-    y2: "200",
-  },
-  key: 12,
-  svg: true,
-};
-const stc11 = {
-  attrs: {
-    x1: "200",
-    y2: "200",
-  },
-  key: 13,
-  svg: true,
-};
-const stc12 = {
-  attrs: {
-    fill: "green",
-    filter: "url(#flood)",
-    cx: "100",
-    cy: "100",
-    r: "90",
-  },
-  key: 14,
-  svg: true,
-};
-const stc13 = {
-  attrs: {
-    transform: "translate(200 0)",
-  },
-  key: 15,
-  svg: true,
-};
-const stc14 = {
-  attrs: {
-    fill: "none",
-    stroke: "blue",
-    "stroke-width": "4",
-  },
-  key: 16,
-  svg: true,
-};
-const stc15 = {
-  attrs: {
-    width: "200",
-    height: "200",
-  },
-  key: 17,
-  svg: true,
-};
-const stc16 = {
-  attrs: {
-    x2: "200",
-    y2: "200",
-  },
-  key: 18,
-  svg: true,
-};
-const stc17 = {
-  attrs: {
-    x1: "200",
-    y2: "200",
-  },
-  key: 19,
-  svg: true,
-};
-const stc18 = {
-  attrs: {
-    fill: "green",
-    filter: "url(#blend)",
-    cx: "100",
-    cy: "100",
-    r: "90",
-  },
-  key: 20,
-  svg: true,
-};
-const stc19 = {
-  attrs: {
-    transform: "translate(0 200)",
-  },
-  key: 21,
-  svg: true,
-};
-const stc20 = {
-  attrs: {
-    fill: "none",
-    stroke: "blue",
-    "stroke-width": "4",
-  },
-  key: 22,
-  svg: true,
-};
-const stc21 = {
-  attrs: {
-    width: "200",
-    height: "200",
-  },
-  key: 23,
-  svg: true,
-};
-const stc22 = {
-  attrs: {
-    x2: "200",
-    y2: "200",
-  },
-  key: 24,
-  svg: true,
-};
-const stc23 = {
-  attrs: {
-    x1: "200",
-    y2: "200",
-  },
-  key: 25,
-  svg: true,
-};
-const stc24 = {
-  attrs: {
-    fill: "green",
-    "fill-opacity": "0.5",
-    filter: "url(#merge)",
-    cx: "100",
-    cy: "100",
-    r: "90",
-  },
-  key: 26,
-  svg: true,
-};
-const stc25 = {
-  attrs: {
-    width: "600",
-    height: "250",
-    viewBox: "0 0 600 250",
-    xmlns: "http://www.w3.org/2000/svg",
-    "xmlns:xlink": "http://www.w3.org/1999/xlink",
-  },
-  key: 27,
-  svg: true,
-};
-const stc26 = {
-  attrs: {
-    fill: "none",
-    stroke: "blue",
-    x: "1",
-    y: "1",
-    width: "598",
-    height: "248",
-  },
-  key: 28,
-  svg: true,
-};
-const stc27 = {
-  key: 29,
-  svg: true,
-};
-const stc28 = {
-  attrs: {
-    x: "50",
-    y: "25",
-    width: "100",
-    height: "200",
-    filter: "url(#Default)",
-  },
-  key: 30,
-  svg: true,
-};
-const stc29 = {
-  attrs: {
-    x: "50",
-    y: "25",
-    width: "100",
-    height: "200",
-    fill: "none",
-    stroke: "green",
-  },
-  key: 31,
-  svg: true,
-};
-const stc30 = {
-  attrs: {
-    x: "250",
-    y: "25",
-    width: "100",
-    height: "200",
-    filter: "url(#Fitted)",
-  },
-  key: 32,
-  svg: true,
-};
-const stc31 = {
-  attrs: {
-    x: "250",
-    y: "25",
-    width: "100",
-    height: "200",
-    fill: "none",
-    stroke: "green",
-  },
-  key: 33,
-  svg: true,
-};
-const stc32 = {
-  attrs: {
-    x: "450",
-    y: "25",
-    width: "100",
-    height: "200",
-    filter: "url(#Shifted)",
-  },
-  key: 34,
-  svg: true,
-};
-const stc33 = {
-  attrs: {
-    x: "450",
-    y: "25",
-    width: "100",
-    height: "200",
-    fill: "none",
-    stroke: "green",
-  },
-  key: 35,
-  svg: true,
-};
-const stc34 = {
-  key: 37,
-  svg: true,
-};
-const stc35 = {
-  attrs: {
-    in: "SourceAlpha",
-    stdDeviation: "4",
-    result: "blur",
-  },
-  key: 38,
-  svg: true,
-};
-const stc36 = {
-  attrs: {
-    in: "blur",
-    dx: "4",
-    dy: "4",
-    result: "offsetBlur",
-  },
-  key: 39,
-  svg: true,
-};
-const stc37 = {
-  attrs: {
-    in: "blur",
-    surfaceScale: "5",
-    specularConstant: ".75",
-    specularExponent: "20",
-    "lighting-color": "#bbbbbb",
-    result: "specOut",
-  },
-  key: 40,
-  svg: true,
-};
-const stc38 = {
-  attrs: {
-    x: "-5000",
-    y: "-10000",
-    z: "20000",
-  },
-  key: 41,
-  svg: true,
-};
-const stc39 = {
-  attrs: {
-    in: "specOut",
-    in2: "SourceAlpha",
-    operator: "in",
-    result: "specOut",
-  },
-  key: 42,
-  svg: true,
-};
-const stc40 = {
-  attrs: {
-    in: "SourceGraphic",
-    in2: "specOut",
-    operator: "arithmetic",
-    k1: "0",
-    k2: "1",
-    k3: "1",
-    k4: "0",
-    result: "litPaint",
-  },
-  key: 43,
-  svg: true,
-};
-const stc41 = {
-  key: 44,
-  svg: true,
-};
-const stc42 = {
-  attrs: {
-    in: "offsetBlur",
-  },
-  key: 45,
-  svg: true,
-};
-const stc43 = {
-  attrs: {
-    in: "litPaint",
-  },
-  key: 46,
-  svg: true,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { gid: api_scoped_id, h: api_element, t: api_text } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element("defs", stc1, [
+    api_element(
+      "svg",
+      {
+        attrs: {
+          width: "400",
+          height: "400",
+          xmlns: "http://www.w3.org/2000/svg",
+        },
+        key: 0,
+        svg: true,
+      },
+      [
         api_element(
-          "filter",
+          "defs",
+          {
+            key: 1,
+            svg: true,
+          },
+          [
+            api_element(
+              "filter",
+              {
+                attrs: {
+                  id: api_scoped_id("flood"),
+                  x: "0",
+                  y: "0",
+                  width: "100%",
+                  height: "100%",
+                  primitiveUnits: "objectBoundingBox",
+                },
+                key: 2,
+                svg: true,
+              },
+              [
+                api_element(
+                  "feFlood",
+                  {
+                    attrs: {
+                      x: "25%",
+                      y: "25%",
+                      width: "50%",
+                      height: "50%",
+                      "flood-color": "green",
+                      "flood-opacity": "0.75",
+                    },
+                    key: 3,
+                    svg: true,
+                  },
+                  []
+                ),
+              ]
+            ),
+            api_element(
+              "filter",
+              {
+                attrs: {
+                  id: api_scoped_id("blend"),
+                  primitiveUnits: "objectBoundingBox",
+                },
+                key: 4,
+                svg: true,
+              },
+              [
+                api_element(
+                  "feBlend",
+                  {
+                    attrs: {
+                      x: "25%",
+                      y: "25%",
+                      width: "50%",
+                      height: "50%",
+                      in2: "SourceGraphic",
+                      mode: "multiply",
+                    },
+                    key: 5,
+                    svg: true,
+                  },
+                  []
+                ),
+              ]
+            ),
+            api_element(
+              "filter",
+              {
+                attrs: {
+                  id: api_scoped_id("merge"),
+                  primitiveUnits: "objectBoundingBox",
+                },
+                key: 6,
+                svg: true,
+              },
+              [
+                api_element(
+                  "feMerge",
+                  {
+                    attrs: {
+                      x: "25%",
+                      y: "25%",
+                      width: "50%",
+                      height: "50%",
+                    },
+                    key: 7,
+                    svg: true,
+                  },
+                  [
+                    api_element(
+                      "feMergeNode",
+                      {
+                        attrs: {
+                          in: "SourceGraphic",
+                        },
+                        key: 8,
+                        svg: true,
+                      },
+                      []
+                    ),
+                    api_element(
+                      "feMergeNode",
+                      {
+                        attrs: {
+                          in: "FillPaint",
+                        },
+                        key: 9,
+                        svg: true,
+                      },
+                      []
+                    ),
+                  ]
+                ),
+              ]
+            ),
+          ]
+        ),
+        api_element(
+          "g",
           {
             attrs: {
-              id: api_scoped_id("flood"),
-              x: "0",
-              y: "0",
-              width: "100%",
-              height: "100%",
-              primitiveUnits: "objectBoundingBox",
+              fill: "none",
+              stroke: "blue",
+              "stroke-width": "4",
             },
-            key: 2,
+            key: 10,
             svg: true,
           },
-          [api_element("feFlood", stc2, stc3)]
+          [
+            api_element(
+              "rect",
+              {
+                attrs: {
+                  width: "200",
+                  height: "200",
+                },
+                key: 11,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "line",
+              {
+                attrs: {
+                  x2: "200",
+                  y2: "200",
+                },
+                key: 12,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "line",
+              {
+                attrs: {
+                  x1: "200",
+                  y2: "200",
+                },
+                key: 13,
+                svg: true,
+              },
+              []
+            ),
+          ]
         ),
         api_element(
-          "filter",
+          "circle",
           {
             attrs: {
-              id: api_scoped_id("blend"),
-              primitiveUnits: "objectBoundingBox",
+              fill: "green",
+              filter: "url(#flood)",
+              cx: "100",
+              cy: "100",
+              r: "90",
             },
-            key: 4,
+            key: 14,
             svg: true,
           },
-          [api_element("feBlend", stc4, stc3)]
+          []
         ),
         api_element(
-          "filter",
+          "g",
           {
             attrs: {
-              id: api_scoped_id("merge"),
-              primitiveUnits: "objectBoundingBox",
+              transform: "translate(200 0)",
             },
-            key: 6,
+            key: 15,
             svg: true,
           },
           [
-            api_element("feMerge", stc5, [
-              api_element("feMergeNode", stc6, stc3),
-              api_element("feMergeNode", stc7, stc3),
-            ]),
+            api_element(
+              "g",
+              {
+                attrs: {
+                  fill: "none",
+                  stroke: "blue",
+                  "stroke-width": "4",
+                },
+                key: 16,
+                svg: true,
+              },
+              [
+                api_element(
+                  "rect",
+                  {
+                    attrs: {
+                      width: "200",
+                      height: "200",
+                    },
+                    key: 17,
+                    svg: true,
+                  },
+                  []
+                ),
+                api_element(
+                  "line",
+                  {
+                    attrs: {
+                      x2: "200",
+                      y2: "200",
+                    },
+                    key: 18,
+                    svg: true,
+                  },
+                  []
+                ),
+                api_element(
+                  "line",
+                  {
+                    attrs: {
+                      x1: "200",
+                      y2: "200",
+                    },
+                    key: 19,
+                    svg: true,
+                  },
+                  []
+                ),
+              ]
+            ),
+            api_element(
+              "circle",
+              {
+                attrs: {
+                  fill: "green",
+                  filter: "url(#blend)",
+                  cx: "100",
+                  cy: "100",
+                  r: "90",
+                },
+                key: 20,
+                svg: true,
+              },
+              []
+            ),
           ]
         ),
-      ]),
-      api_element("g", stc8, [
-        api_element("rect", stc9, stc3),
-        api_element("line", stc10, stc3),
-        api_element("line", stc11, stc3),
-      ]),
-      api_element("circle", stc12, stc3),
-      api_element("g", stc13, [
-        api_element("g", stc14, [
-          api_element("rect", stc15, stc3),
-          api_element("line", stc16, stc3),
-          api_element("line", stc17, stc3),
-        ]),
-        api_element("circle", stc18, stc3),
-      ]),
-      api_element("g", stc19, [
-        api_element("g", stc20, [
-          api_element("rect", stc21, stc3),
-          api_element("line", stc22, stc3),
-          api_element("line", stc23, stc3),
-        ]),
-        api_element("circle", stc24, stc3),
-      ]),
-    ]),
-    api_element("svg", stc25, [
-      api_element("rect", stc26, stc3),
-      api_element("g", stc27, [
-        api_element("rect", stc28, stc3),
-        api_element("rect", stc29, stc3),
-        api_element("rect", stc30, stc3),
-        api_element("rect", stc31, stc3),
-        api_element("rect", stc32, stc3),
-        api_element("rect", stc33, stc3),
-      ]),
-      api_element(
-        "filter",
-        {
-          attrs: {
-            id: api_scoped_id("MyFilter"),
-            filterUnits: "userSpaceOnUse",
-            x: "0",
-            y: "0",
-            width: "200",
-            height: "120",
+        api_element(
+          "g",
+          {
+            attrs: {
+              transform: "translate(0 200)",
+            },
+            key: 21,
+            svg: true,
           },
-          key: 36,
-          svg: true,
+          [
+            api_element(
+              "g",
+              {
+                attrs: {
+                  fill: "none",
+                  stroke: "blue",
+                  "stroke-width": "4",
+                },
+                key: 22,
+                svg: true,
+              },
+              [
+                api_element(
+                  "rect",
+                  {
+                    attrs: {
+                      width: "200",
+                      height: "200",
+                    },
+                    key: 23,
+                    svg: true,
+                  },
+                  []
+                ),
+                api_element(
+                  "line",
+                  {
+                    attrs: {
+                      x2: "200",
+                      y2: "200",
+                    },
+                    key: 24,
+                    svg: true,
+                  },
+                  []
+                ),
+                api_element(
+                  "line",
+                  {
+                    attrs: {
+                      x1: "200",
+                      y2: "200",
+                    },
+                    key: 25,
+                    svg: true,
+                  },
+                  []
+                ),
+              ]
+            ),
+            api_element(
+              "circle",
+              {
+                attrs: {
+                  fill: "green",
+                  "fill-opacity": "0.5",
+                  filter: "url(#merge)",
+                  cx: "100",
+                  cy: "100",
+                  r: "90",
+                },
+                key: 26,
+                svg: true,
+              },
+              []
+            ),
+          ]
+        ),
+      ]
+    ),
+    api_element(
+      "svg",
+      {
+        attrs: {
+          width: "600",
+          height: "250",
+          viewBox: "0 0 600 250",
+          xmlns: "http://www.w3.org/2000/svg",
+          "xmlns:xlink": "http://www.w3.org/1999/xlink",
         },
-        [
-          api_element("desc", stc34, [
-            api_text("Produces a 3D lighting effect."),
-          ]),
-          api_element("feGaussianBlur", stc35, stc3),
-          api_element("feOffset", stc36, stc3),
-          api_element("feSpecularLighting", stc37, [
-            api_element("fePointLight", stc38, stc3),
-          ]),
-          api_element("feComposite", stc39, stc3),
-          api_element("feComposite", stc40, stc3),
-          api_element("feMerge", stc41, [
-            api_element("feMergeNode", stc42, stc3),
-            api_element("feMergeNode", stc43, stc3),
-          ]),
-        ]
-      ),
-    ]),
+        key: 27,
+        svg: true,
+      },
+      [
+        api_element(
+          "rect",
+          {
+            attrs: {
+              fill: "none",
+              stroke: "blue",
+              x: "1",
+              y: "1",
+              width: "598",
+              height: "248",
+            },
+            key: 28,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "g",
+          {
+            key: 29,
+            svg: true,
+          },
+          [
+            api_element(
+              "rect",
+              {
+                attrs: {
+                  x: "50",
+                  y: "25",
+                  width: "100",
+                  height: "200",
+                  filter: "url(#Default)",
+                },
+                key: 30,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "rect",
+              {
+                attrs: {
+                  x: "50",
+                  y: "25",
+                  width: "100",
+                  height: "200",
+                  fill: "none",
+                  stroke: "green",
+                },
+                key: 31,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "rect",
+              {
+                attrs: {
+                  x: "250",
+                  y: "25",
+                  width: "100",
+                  height: "200",
+                  filter: "url(#Fitted)",
+                },
+                key: 32,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "rect",
+              {
+                attrs: {
+                  x: "250",
+                  y: "25",
+                  width: "100",
+                  height: "200",
+                  fill: "none",
+                  stroke: "green",
+                },
+                key: 33,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "rect",
+              {
+                attrs: {
+                  x: "450",
+                  y: "25",
+                  width: "100",
+                  height: "200",
+                  filter: "url(#Shifted)",
+                },
+                key: 34,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "rect",
+              {
+                attrs: {
+                  x: "450",
+                  y: "25",
+                  width: "100",
+                  height: "200",
+                  fill: "none",
+                  stroke: "green",
+                },
+                key: 35,
+                svg: true,
+              },
+              []
+            ),
+          ]
+        ),
+        api_element(
+          "filter",
+          {
+            attrs: {
+              id: api_scoped_id("MyFilter"),
+              filterUnits: "userSpaceOnUse",
+              x: "0",
+              y: "0",
+              width: "200",
+              height: "120",
+            },
+            key: 36,
+            svg: true,
+          },
+          [
+            api_element(
+              "desc",
+              {
+                key: 37,
+                svg: true,
+              },
+              [api_text("Produces a 3D lighting effect.")]
+            ),
+            api_element(
+              "feGaussianBlur",
+              {
+                attrs: {
+                  in: "SourceAlpha",
+                  stdDeviation: "4",
+                  result: "blur",
+                },
+                key: 38,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "feOffset",
+              {
+                attrs: {
+                  in: "blur",
+                  dx: "4",
+                  dy: "4",
+                  result: "offsetBlur",
+                },
+                key: 39,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "feSpecularLighting",
+              {
+                attrs: {
+                  in: "blur",
+                  surfaceScale: "5",
+                  specularConstant: ".75",
+                  specularExponent: "20",
+                  "lighting-color": "#bbbbbb",
+                  result: "specOut",
+                },
+                key: 40,
+                svg: true,
+              },
+              [
+                api_element(
+                  "fePointLight",
+                  {
+                    attrs: {
+                      x: "-5000",
+                      y: "-10000",
+                      z: "20000",
+                    },
+                    key: 41,
+                    svg: true,
+                  },
+                  []
+                ),
+              ]
+            ),
+            api_element(
+              "feComposite",
+              {
+                attrs: {
+                  in: "specOut",
+                  in2: "SourceAlpha",
+                  operator: "in",
+                  result: "specOut",
+                },
+                key: 42,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "feComposite",
+              {
+                attrs: {
+                  in: "SourceGraphic",
+                  in2: "specOut",
+                  operator: "arithmetic",
+                  k1: "0",
+                  k2: "1",
+                  k3: "1",
+                  k4: "0",
+                  result: "litPaint",
+                },
+                key: 43,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "feMerge",
+              {
+                key: 44,
+                svg: true,
+              },
+              [
+                api_element(
+                  "feMergeNode",
+                  {
+                    attrs: {
+                      in: "offsetBlur",
+                    },
+                    key: 45,
+                    svg: true,
+                  },
+                  []
+                ),
+                api_element(
+                  "feMergeNode",
+                  {
+                    attrs: {
+                      in: "litPaint",
+                    },
+                    key: 46,
+                    svg: true,
+                  },
+                  []
+                ),
+              ]
+            ),
+          ]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/foreign-object/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/foreign-object/expected.js
index a221acca9e..70ad6d595c 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/foreign-object/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/foreign-object/expected.js
@@ -1,55 +1,73 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-};
-const stc1 = {
-  attrs: {
-    width: "706",
-    height: "180",
-  },
-  key: 1,
-  svg: true,
-};
-const stc2 = {
-  attrs: {
-    transform: "translate(3,3)",
-  },
-  key: 2,
-  svg: true,
-};
-const stc3 = {
-  attrs: {
-    transform: "translate(250,0)",
-  },
-  key: 3,
-  svg: true,
-};
-const stc4 = {
-  attrs: {
-    width: "200",
-    height: "36",
-    "xlink:href": "javascript:alert(1)",
-  },
-  key: 4,
-  svg: true,
-};
-const stc5 = {
-  key: 5,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { t: api_text, h: api_element } = $api;
   return [
-    api_element("div", stc0, [
-      api_element("svg", stc1, [
-        api_element("g", stc2, [
-          api_element("g", stc3, [
-            api_element("foreignObject", stc4, [
-              api_element("a", stc5, [api_text("x")]),
-            ]),
-          ]),
-        ]),
-      ]),
-    ]),
+    api_element(
+      "div",
+      {
+        key: 0,
+      },
+      [
+        api_element(
+          "svg",
+          {
+            attrs: {
+              width: "706",
+              height: "180",
+            },
+            key: 1,
+            svg: true,
+          },
+          [
+            api_element(
+              "g",
+              {
+                attrs: {
+                  transform: "translate(3,3)",
+                },
+                key: 2,
+                svg: true,
+              },
+              [
+                api_element(
+                  "g",
+                  {
+                    attrs: {
+                      transform: "translate(250,0)",
+                    },
+                    key: 3,
+                    svg: true,
+                  },
+                  [
+                    api_element(
+                      "foreignObject",
+                      {
+                        attrs: {
+                          width: "200",
+                          height: "36",
+                          "xlink:href": "javascript:alert(1)",
+                        },
+                        key: 4,
+                        svg: true,
+                      },
+                      [
+                        api_element(
+                          "a",
+                          {
+                            key: 5,
+                          },
+                          [api_text("x")]
+                        ),
+                      ]
+                    ),
+                  ]
+                ),
+              ]
+            ),
+          ]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/linear-gradient/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/linear-gradient/expected.js
index ca9f694bb1..d9819a96e4 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/linear-gradient/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/linear-gradient/expected.js
@@ -1,73 +1,90 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    height: "150",
-    width: "400",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = {
-  key: 1,
-  svg: true,
-};
-const stc2 = {
-  styleDecls: [
-    ["stop-color", "rgb(255,255,0)", false],
-    ["stop-opacity", "1", false],
-  ],
-  attrs: {
-    offset: "0%",
-  },
-  key: 3,
-  svg: true,
-};
-const stc3 = [];
-const stc4 = {
-  styleDecls: [
-    ["stop-color", "rgb(255,0,0)", false],
-    ["stop-opacity", "1", false],
-  ],
-  attrs: {
-    offset: "100%",
-  },
-  key: 4,
-  svg: true,
-};
-const stc5 = {
-  attrs: {
-    cx: "200",
-    cy: "70",
-    rx: "85",
-    ry: "55",
-    fill: "url(#grad1)",
-  },
-  key: 5,
-  svg: true,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { gid: api_scoped_id, h: api_element } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element("defs", stc1, [
+    api_element(
+      "svg",
+      {
+        attrs: {
+          height: "150",
+          width: "400",
+        },
+        key: 0,
+        svg: true,
+      },
+      [
         api_element(
-          "linearGradient",
+          "defs",
+          {
+            key: 1,
+            svg: true,
+          },
+          [
+            api_element(
+              "linearGradient",
+              {
+                attrs: {
+                  id: api_scoped_id("grad1"),
+                  x1: "0%",
+                  y1: "0%",
+                  x2: "100%",
+                  y2: "0%",
+                },
+                key: 2,
+                svg: true,
+              },
+              [
+                api_element(
+                  "stop",
+                  {
+                    styleDecls: [
+                      ["stop-color", "rgb(255,255,0)", false],
+                      ["stop-opacity", "1", false],
+                    ],
+                    attrs: {
+                      offset: "0%",
+                    },
+                    key: 3,
+                    svg: true,
+                  },
+                  []
+                ),
+                api_element(
+                  "stop",
+                  {
+                    styleDecls: [
+                      ["stop-color", "rgb(255,0,0)", false],
+                      ["stop-opacity", "1", false],
+                    ],
+                    attrs: {
+                      offset: "100%",
+                    },
+                    key: 4,
+                    svg: true,
+                  },
+                  []
+                ),
+              ]
+            ),
+          ]
+        ),
+        api_element(
+          "ellipse",
           {
             attrs: {
-              id: api_scoped_id("grad1"),
-              x1: "0%",
-              y1: "0%",
-              x2: "100%",
-              y2: "0%",
+              cx: "200",
+              cy: "70",
+              rx: "85",
+              ry: "55",
+              fill: "url(#grad1)",
             },
-            key: 2,
+            key: 5,
             svg: true,
           },
-          [api_element("stop", stc2, stc3), api_element("stop", stc4, stc3)]
+          []
         ),
-      ]),
-      api_element("ellipse", stc5, stc3),
-    ]),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-dynamic/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-dynamic/expected.js
index 7e8c2f4411..08a347b984 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-dynamic/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-dynamic/expected.js
@@ -1,87 +1,92 @@
 import { registerTemplate, sanitizeAttribute } from "lwc";
-const stc0 = {
-  attrs: {
-    width: "100px",
-    height: "100px",
-    viewport: "0 0 100 100",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = {
-  key: 1,
-  svg: true,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { gid: api_scoped_id, h: api_element, fid: api_scoped_frag_id } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element("defs", stc1, [
+    api_element(
+      "svg",
+      {
+        attrs: {
+          width: "100px",
+          height: "100px",
+          viewport: "0 0 100 100",
+        },
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "defs",
+          {
+            key: 1,
+            svg: true,
+          },
+          [
+            api_element(
+              "circle",
+              {
+                attrs: {
+                  id: api_scoped_id($cmp.blackId),
+                  r: "10",
+                  cx: "10",
+                  cy: "10",
+                  fill: "black",
+                },
+                key: 2,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "circle",
+              {
+                attrs: {
+                  id: api_scoped_id($cmp.redId),
+                  r: "10",
+                  cx: "14",
+                  cy: "14",
+                  fill: "red",
+                },
+                key: 3,
+                svg: true,
+              },
+              []
+            ),
+          ]
+        ),
         api_element(
-          "circle",
+          "use",
           {
             attrs: {
-              id: api_scoped_id($cmp.blackId),
-              r: "10",
-              cx: "10",
-              cy: "10",
-              fill: "black",
+              href: sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "href",
+                api_scoped_frag_id($cmp.blackUrl)
+              ),
             },
-            key: 2,
+            key: 4,
             svg: true,
           },
-          stc2
+          []
         ),
         api_element(
-          "circle",
+          "use",
           {
             attrs: {
-              id: api_scoped_id($cmp.redId),
-              r: "10",
-              cx: "14",
-              cy: "14",
-              fill: "red",
+              "xlink:href": sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "xlink:href",
+                api_scoped_frag_id($cmp.redUrl)
+              ),
             },
-            key: 3,
+            key: 5,
             svg: true,
           },
-          stc2
+          []
         ),
-      ]),
-      api_element(
-        "use",
-        {
-          attrs: {
-            href: sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "href",
-              api_scoped_frag_id($cmp.blackUrl)
-            ),
-          },
-          key: 4,
-          svg: true,
-        },
-        stc2
-      ),
-      api_element(
-        "use",
-        {
-          attrs: {
-            "xlink:href": sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "xlink:href",
-              api_scoped_frag_id($cmp.redUrl)
-            ),
-          },
-          key: 5,
-          svg: true,
-        },
-        stc2
-      ),
-    ]),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-static/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-static/expected.js
index 7d5f244ee3..c0d93208d0 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-static/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/scoped-id-static/expected.js
@@ -1,87 +1,92 @@
 import { registerTemplate, sanitizeAttribute } from "lwc";
-const stc0 = {
-  attrs: {
-    width: "100px",
-    height: "100px",
-    viewport: "0 0 100 100",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = {
-  key: 1,
-  svg: true,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { gid: api_scoped_id, h: api_element, fid: api_scoped_frag_id } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element("defs", stc1, [
+    api_element(
+      "svg",
+      {
+        attrs: {
+          width: "100px",
+          height: "100px",
+          viewport: "0 0 100 100",
+        },
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "defs",
+          {
+            key: 1,
+            svg: true,
+          },
+          [
+            api_element(
+              "circle",
+              {
+                attrs: {
+                  id: api_scoped_id("black"),
+                  r: "10",
+                  cx: "10",
+                  cy: "10",
+                  fill: "black",
+                },
+                key: 2,
+                svg: true,
+              },
+              []
+            ),
+            api_element(
+              "circle",
+              {
+                attrs: {
+                  id: api_scoped_id("red"),
+                  r: "10",
+                  cx: "14",
+                  cy: "14",
+                  fill: "red",
+                },
+                key: 3,
+                svg: true,
+              },
+              []
+            ),
+          ]
+        ),
         api_element(
-          "circle",
+          "use",
           {
             attrs: {
-              id: api_scoped_id("black"),
-              r: "10",
-              cx: "10",
-              cy: "10",
-              fill: "black",
+              href: sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "href",
+                api_scoped_frag_id("#black")
+              ),
             },
-            key: 2,
+            key: 4,
             svg: true,
           },
-          stc2
+          []
         ),
         api_element(
-          "circle",
+          "use",
           {
             attrs: {
-              id: api_scoped_id("red"),
-              r: "10",
-              cx: "14",
-              cy: "14",
-              fill: "red",
+              "xlink:href": sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "xlink:href",
+                api_scoped_frag_id("#red")
+              ),
             },
-            key: 3,
+            key: 5,
             svg: true,
           },
-          stc2
+          []
         ),
-      ]),
-      api_element(
-        "use",
-        {
-          attrs: {
-            href: sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "href",
-              api_scoped_frag_id("#black")
-            ),
-          },
-          key: 4,
-          svg: true,
-        },
-        stc2
-      ),
-      api_element(
-        "use",
-        {
-          attrs: {
-            "xlink:href": sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "xlink:href",
-              api_scoped_frag_id("#red")
-            ),
-          },
-          key: 5,
-          svg: true,
-        },
-        stc2
-      ),
-    ]),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/simple-svg/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/simple-svg/expected.js
index e53ec38504..cf40c306ac 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/simple-svg/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/simple-svg/expected.js
@@ -1,54 +1,65 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    version: "1.1",
-    baseProfile: "full",
-    width: "300",
-    height: "200",
-    xmlns: "http://www.w3.org/2000/svg",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = {
-  attrs: {
-    width: "100%",
-    height: "100%",
-    fill: "red",
-  },
-  key: 1,
-  svg: true,
-};
-const stc2 = [];
-const stc3 = {
-  attrs: {
-    cx: "150",
-    cy: "100",
-    r: "80",
-    fill: "green",
-  },
-  key: 2,
-  svg: true,
-};
-const stc4 = {
-  attrs: {
-    x: "150",
-    y: "125",
-    "font-size": "60",
-    "text-anchor": "middle",
-    fill: "white",
-  },
-  key: 3,
-  svg: true,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element, t: api_text } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element("rect", stc1, stc2),
-      api_element("circle", stc3, stc2),
-      api_element("text", stc4, [api_text("SVG")]),
-    ]),
+    api_element(
+      "svg",
+      {
+        attrs: {
+          version: "1.1",
+          baseProfile: "full",
+          width: "300",
+          height: "200",
+          xmlns: "http://www.w3.org/2000/svg",
+        },
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "rect",
+          {
+            attrs: {
+              width: "100%",
+              height: "100%",
+              fill: "red",
+            },
+            key: 1,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "circle",
+          {
+            attrs: {
+              cx: "150",
+              cy: "100",
+              r: "80",
+              fill: "green",
+            },
+            key: 2,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "text",
+          {
+            attrs: {
+              x: "150",
+              y: "125",
+              "font-size": "60",
+              "text-anchor": "middle",
+              fill: "white",
+            },
+            key: 3,
+            svg: true,
+          },
+          [api_text("SVG")]
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-image/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-image/expected.js
index f0a4a50a96..454fc46634 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-image/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-image/expected.js
@@ -1,27 +1,36 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  attrs: {
-    width: "200",
-    height: "200",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = {
-  attrs: {
-    "xlink:href": "/foo.png",
-    x: "1",
-    y: "2",
-    height: "200",
-    width: "200",
-  },
-  key: 1,
-  svg: true,
-};
-const stc2 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
-  return [api_element("svg", stc0, [api_element("image", stc1, stc2)])];
+  return [
+    api_element(
+      "svg",
+      {
+        attrs: {
+          width: "200",
+          height: "200",
+        },
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "image",
+          {
+            attrs: {
+              "xlink:href": "/foo.png",
+              x: "1",
+              y: "2",
+              height: "200",
+              width: "200",
+            },
+            key: 1,
+            svg: true,
+          },
+          []
+        ),
+      ]
+    ),
+  ];
 }
 export default registerTemplate(tmpl);
 tmpl.stylesheets = [];
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-svg/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-svg/expected.js
index 61e13def37..d49e21c8a5 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-svg/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/valid-svg/expected.js
@@ -1,119 +1,184 @@
 import { registerTemplate } from "lwc";
-const stc0 = {
-  key: 0,
-  svg: true,
-};
-const stc1 = {
-  key: 1,
-  svg: true,
-};
-const stc2 = [];
-const stc3 = {
-  key: 2,
-  svg: true,
-};
-const stc4 = {
-  key: 3,
-  svg: true,
-};
-const stc5 = {
-  key: 4,
-  svg: true,
-};
-const stc6 = {
-  key: 5,
-  svg: true,
-};
-const stc7 = {
-  key: 6,
-  svg: true,
-};
-const stc8 = {
-  key: 7,
-  svg: true,
-};
-const stc9 = {
-  key: 8,
-  svg: true,
-};
-const stc10 = {
-  key: 9,
-  svg: true,
-};
-const stc11 = {
-  key: 10,
-  svg: true,
-};
-const stc12 = {
-  key: 11,
-  svg: true,
-};
-const stc13 = {
-  key: 12,
-  svg: true,
-};
-const stc14 = {
-  key: 13,
-  svg: true,
-};
-const stc15 = {
-  key: 14,
-  svg: true,
-};
-const stc16 = {
-  key: 15,
-  svg: true,
-};
-const stc17 = {
-  key: 16,
-  svg: true,
-};
-const stc18 = {
-  key: 17,
-  svg: true,
-};
-const stc19 = {
-  key: 18,
-  svg: true,
-};
-const stc20 = {
-  key: 19,
-  svg: true,
-};
-const stc21 = {
-  key: 20,
-  svg: true,
-};
-const stc22 = {
-  key: 21,
-  svg: true,
-};
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element("a", stc1, stc2),
-      api_element("circle", stc3, stc2),
-      api_element("defs", stc4, stc2),
-      api_element("desc", stc5, stc2),
-      api_element("ellipse", stc6, stc2),
-      api_element("filter", stc7, stc2),
-      api_element("g", stc8, stc2),
-      api_element("line", stc9, stc2),
-      api_element("marker", stc10, stc2),
-      api_element("mask", stc11, stc2),
-      api_element("path", stc12, stc2),
-      api_element("pattern", stc13, stc2),
-      api_element("polygon", stc14, stc2),
-      api_element("polyline", stc15, stc2),
-      api_element("rect", stc16, stc2),
-      api_element("stop", stc17, stc2),
-      api_element("symbol", stc18, stc2),
-      api_element("text", stc19, stc2),
-      api_element("title", stc20, stc2),
-      api_element("tspan", stc21, stc2),
-      api_element("use", stc22, stc2),
-    ]),
+    api_element(
+      "svg",
+      {
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "a",
+          {
+            key: 1,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "circle",
+          {
+            key: 2,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "defs",
+          {
+            key: 3,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "desc",
+          {
+            key: 4,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "ellipse",
+          {
+            key: 5,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "filter",
+          {
+            key: 6,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "g",
+          {
+            key: 7,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "line",
+          {
+            key: 8,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "marker",
+          {
+            key: 9,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "mask",
+          {
+            key: 10,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "path",
+          {
+            key: 11,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "pattern",
+          {
+            key: 12,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "polygon",
+          {
+            key: 13,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "polyline",
+          {
+            key: 14,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "rect",
+          {
+            key: 15,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "stop",
+          {
+            key: 16,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "symbol",
+          {
+            key: 17,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "text",
+          {
+            key: 18,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "title",
+          {
+            key: 19,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "tspan",
+          {
+            key: 20,
+            svg: true,
+          },
+          []
+        ),
+        api_element(
+          "use",
+          {
+            key: 21,
+            svg: true,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-expression-value/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-expression-value/expected.js
index 56679b19d8..4b8c3246c1 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-expression-value/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-expression-value/expected.js
@@ -1,37 +1,39 @@
 import { registerTemplate, sanitizeAttribute } from "lwc";
-const stc0 = {
-  classMap: {
-    "slds-icon": true,
-  },
-  attrs: {
-    "aria-hidden": "true",
-    title: "when needed",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { fid: api_scoped_frag_id, h: api_element } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element(
-        "use",
-        {
-          attrs: {
-            "xlink:href": sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "xlink:href",
-              api_scoped_frag_id($cmp.getXLink)
-            ),
-          },
-          key: 1,
-          svg: true,
+    api_element(
+      "svg",
+      {
+        classMap: {
+          "slds-icon": true,
+        },
+        attrs: {
+          "aria-hidden": "true",
+          title: "when needed",
         },
-        stc1
-      ),
-    ]),
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "use",
+          {
+            attrs: {
+              "xlink:href": sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "xlink:href",
+                api_scoped_frag_id($cmp.getXLink)
+              ),
+            },
+            key: 1,
+            svg: true,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-literal-value/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-literal-value/expected.js
index b20751fed8..074d3ba380 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-literal-value/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/svg/xlink-with-literal-value/expected.js
@@ -1,37 +1,39 @@
 import { registerTemplate, sanitizeAttribute } from "lwc";
-const stc0 = {
-  classMap: {
-    "slds-icon": true,
-  },
-  attrs: {
-    "aria-hidden": "true",
-    title: "when needed",
-  },
-  key: 0,
-  svg: true,
-};
-const stc1 = [];
 function tmpl($api, $cmp, $slotset, $ctx) {
   const { h: api_element } = $api;
   return [
-    api_element("svg", stc0, [
-      api_element(
-        "use",
-        {
-          attrs: {
-            "xlink:href": sanitizeAttribute(
-              "use",
-              "http://www.w3.org/2000/svg",
-              "xlink:href",
-              "/assets/icons/standard-sprite/svg/symbols.svg#case"
-            ),
-          },
-          key: 1,
-          svg: true,
+    api_element(
+      "svg",
+      {
+        classMap: {
+          "slds-icon": true,
+        },
+        attrs: {
+          "aria-hidden": "true",
+          title: "when needed",
         },
-        stc1
-      ),
-    ]),
+        key: 0,
+        svg: true,
+      },
+      [
+        api_element(
+          "use",
+          {
+            attrs: {
+              "xlink:href": sanitizeAttribute(
+                "use",
+                "http://www.w3.org/2000/svg",
+                "xlink:href",
+                "/assets/icons/standard-sprite/svg/symbols.svg#case"
+              ),
+            },
+            key: 1,
+            svg: true,
+          },
+          []
+        ),
+      ]
+    ),
   ];
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/codegen/formatters/function.ts b/packages/@lwc/template-compiler/src/codegen/formatters/function.ts
index 1a11d08fd7..5687107b96 100644
--- a/packages/@lwc/template-compiler/src/codegen/formatters/function.ts
+++ b/packages/@lwc/template-compiler/src/codegen/formatters/function.ts
@@ -10,7 +10,6 @@ import { TEMPLATE_FUNCTION_NAME, TEMPLATE_MODULES_PARAMETER } from '../../shared
 
 import CodeGen from '../codegen';
 import { identifierFromComponentName, generateTemplateMetadata } from '../helpers';
-import { optimizeStaticExpressions } from '../optimize';
 
 /**
  * Generate a function body AST from a template ESTree AST. This function can then be instantiated
@@ -47,13 +46,11 @@ export function format(templateFn: t.FunctionDeclaration, codeGen: CodeGen): t.P
             ]);
         });
 
-    const optimizedTemplateDeclarations = optimizeStaticExpressions(templateFn);
-
     const metadata = generateTemplateMetadata(codeGen);
 
     return t.program([
         ...lookups,
-        ...optimizedTemplateDeclarations,
+        templateFn,
         ...metadata,
         t.returnStatement(t.identifier(TEMPLATE_FUNCTION_NAME)),
     ]);
diff --git a/packages/@lwc/template-compiler/src/codegen/formatters/module.ts b/packages/@lwc/template-compiler/src/codegen/formatters/module.ts
index 22c5b71d6b..c3a5595260 100644
--- a/packages/@lwc/template-compiler/src/codegen/formatters/module.ts
+++ b/packages/@lwc/template-compiler/src/codegen/formatters/module.ts
@@ -14,7 +14,6 @@ import {
 
 import CodeGen from '../codegen';
 import { identifierFromComponentName, generateTemplateMetadata } from '../helpers';
-import { optimizeStaticExpressions } from '../optimize';
 
 function generateComponentImports(codeGen: CodeGen): t.ImportDeclaration[] {
     return Array.from(codeGen.referencedComponents).map((name) => {
@@ -63,10 +62,8 @@ export function format(templateFn: t.FunctionDeclaration, codeGen: CodeGen): t.P
 
     const metadata = generateTemplateMetadata(codeGen);
 
-    const optimizedTemplateDeclarations = optimizeStaticExpressions(templateFn);
-
     const templateBody = [
-        ...optimizedTemplateDeclarations,
+        templateFn,
         t.exportDefaultDeclaration(
             t.callExpression(t.identifier(SECURE_REGISTER_TEMPLATE_METHOD_NAME), [
                 t.identifier(TEMPLATE_FUNCTION_NAME),
diff --git a/packages/@lwc/template-compiler/src/codegen/optimize.ts b/packages/@lwc/template-compiler/src/codegen/optimize.ts
deleted file mode 100644
index f1b3e3f625..0000000000
--- a/packages/@lwc/template-compiler/src/codegen/optimize.ts
+++ /dev/null
@@ -1,107 +0,0 @@
-/*
- * Copyright (c) 2018, salesforce.com, inc.
- * All rights reserved.
- * SPDX-License-Identifier: MIT
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
- */
-import * as astring from 'astring';
-import { walk } from 'estree-walker';
-import * as t from '../shared/estree';
-
-/**
- * Given a template function, extract all static objects/arrays (e.g. `{ key : 1 }`)
- * and return them as a list of `const` declarations. Also return the modified function
- * that is now referencing those declarations.
- *
- * Example input:
- *
- * ```
- * function tmpl() {
- *   return {
- *     foo: dynamic(),
- *     bar: { static: true },
- *     baz: { really: { static: ['yep', 'totally', 'static' ] } }
- *   };
- * }
- * ```
- *
- * Example output:
- *
- * ```
- * const stc0 = { static: true };
- * const stc1 = { really: { static: ['yep', 'totally', 'static' ] } };
- * function tmpl() {
- *   return {
- *     foo: dynamic(),
- *     bar: stc0,
- *     baz: stc1
- *   };
- * }
- * ```
- */
-export function optimizeStaticExpressions(
-    templateFn: t.FunctionDeclaration
-): Array<t.FunctionDeclaration | t.VariableDeclaration> {
-    const result: Array<t.FunctionDeclaration | t.VariableDeclaration> = [];
-    const keysToVariableNames = new Map();
-
-    // Return true if this node is an object/array that is fully static
-    function isStaticObjectOrArray(
-        node: t.BaseNode
-    ): node is t.ObjectExpression | t.ArrayExpression {
-        if (t.isObjectExpression(node)) {
-            return node.properties.every((prop) => {
-                return (
-                    t.isProperty(prop) &&
-                    !prop.computed &&
-                    !prop.method &&
-                    !prop.shorthand &&
-                    (t.isLiteral(prop.value) || isStaticObjectOrArray(prop.value))
-                );
-            });
-        } else if (t.isArrayExpression(node)) {
-            return node.elements.every((element) => {
-                return element !== null && (t.isLiteral(element) || isStaticObjectOrArray(element));
-            });
-        }
-        return false;
-    }
-
-    function extractStaticVariable(node: t.Expression): t.Identifier {
-        // This key generation can probably be improved using a hash code, but stringification is
-        // simplest for finding a unique identifier for an object/array expression
-        const key = astring.generate(node);
-
-        // Check for duplicates to avoid re-declaring the same object/array multiple times
-        // Especially for the empty array (`[]`), which is very common in templates
-        if (!keysToVariableNames.has(key)) {
-            const variableName = `stc${keysToVariableNames.size}`;
-            // e.g. `const stc0 = { /* original object */ };
-            const declaration = t.variableDeclaration('const', [
-                t.variableDeclarator(
-                    t.identifier(variableName),
-                    node as t.ArrayExpression | t.ObjectExpression
-                ),
-            ]);
-            result.push(declaration);
-            keysToVariableNames.set(key, variableName);
-        }
-
-        return t.identifier(keysToVariableNames.get(key));
-    }
-
-    walk(templateFn, {
-        enter(node) {
-            // For deeply-nested static object, we only want to extract the top-level node
-            if (isStaticObjectOrArray(node)) {
-                const newNode = extractStaticVariable(node);
-                this.replace(newNode);
-                this.skip();
-            }
-        },
-    });
-
-    result.push(templateFn);
-
-    return result;
-}
diff --git a/packages/@lwc/template-compiler/src/shared/estree.ts b/packages/@lwc/template-compiler/src/shared/estree.ts
index 7631185057..da822ca9f3 100644
--- a/packages/@lwc/template-compiler/src/shared/estree.ts
+++ b/packages/@lwc/template-compiler/src/shared/estree.ts
@@ -18,14 +18,6 @@ export function isArrayExpression(node: t.BaseNode): node is t.ArrayExpression {
     return node.type === 'ArrayExpression';
 }
 
-export function isObjectExpression(node: t.BaseNode): node is t.ObjectExpression {
-    return node.type === 'ObjectExpression';
-}
-
-export function isProperty(node: t.BaseNode): node is t.Property {
-    return node.type === 'Property';
-}
-
 export function identifier(name: string, config?: Partial<t.Identifier>): t.Identifier {
     return {
         type: 'Identifier',