diff --git a/CHANGELOG.md b/CHANGELOG.md
index fd4ff5f7ac..aa0a2d4c52 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,7 @@
 ## 3.55.1 (unreleased)
 
 * add missing `submitter` property to `on:submit` event type
+* Fix static `<svelte:element>` optimization in production mode ([#7938](https://github.com/sveltejs/svelte/pull/7938))
 
 ## 3.55.0
 
diff --git a/src/compiler/compile/nodes/Element.ts b/src/compiler/compile/nodes/Element.ts
index a499d013e3..06ef1ba9c1 100644
--- a/src/compiler/compile/nodes/Element.ts
+++ b/src/compiler/compile/nodes/Element.ts
@@ -239,6 +239,7 @@ export default class Element extends Node {
 				this.tag_expr = new Expression(component, this, scope, info.tag);
 			} else {
 				this.tag_expr = new Expression(component, this, scope, string_literal(info.tag) as Literal);
+				this.name = info.tag;
 			}
 		} else {
 			this.tag_expr = new Expression(component, this, scope, string_literal(this.name) as Literal);
diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts
index 71adf0c51f..8a8f59810b 100644
--- a/src/compiler/compile/render_dom/wrappers/Element/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts
@@ -261,6 +261,7 @@ export default class ElementWrapper extends Wrapper {
 				node.styles.length > 0 ||
 				this.node.name === 'option' ||
 				node.tag_expr.dynamic_dependencies().length ||
+				node.is_dynamic_element ||
 				renderer.options.dev
 			) {
 				this.parent.cannot_use_innerhtml(); // need to use add_location
@@ -1181,10 +1182,12 @@ function to_html(wrappers: Array<ElementWrapper | TextWrapper | MustacheTagWrapp
 		} else if (wrapper.node.name === 'noscript') {
 			// do nothing
 		} else {
+			const nodeName = wrapper.node.name;
+
 			// element
-			state.quasi.value.raw += `<${wrapper.node.name}`;
+			state.quasi.value.raw += `<${nodeName}`;
 
-			const is_empty_textarea = wrapper.node.name === 'textarea' && wrapper.fragment.nodes.length === 0;
+			const is_empty_textarea = nodeName === 'textarea' && wrapper.fragment.nodes.length === 0;
 
 			(wrapper as ElementWrapper).attributes.forEach((attr: AttributeWrapper) => {
 				if (is_empty_textarea && attr.node.name === 'value') {
@@ -1201,7 +1204,7 @@ function to_html(wrappers: Array<ElementWrapper | TextWrapper | MustacheTagWrapp
 			if (!wrapper.void) {
 				state.quasi.value.raw += '>';
 
-				if (wrapper.node.name === 'pre') {
+				if (nodeName === 'pre') {
 					// Two or more leading newlines are required to restore the leading newline immediately after `<pre>`.
 					// see https://html.spec.whatwg.org/multipage/grouping-content.html#the-pre-element
 					const first = wrapper.fragment.nodes[0];
@@ -1226,7 +1229,7 @@ function to_html(wrappers: Array<ElementWrapper | TextWrapper | MustacheTagWrapp
 
 				to_html(wrapper.fragment.nodes as Array<ElementWrapper | TextWrapper>, block, literal, state);
 
-				state.quasi.value.raw += `</${wrapper.node.name}>`;
+				state.quasi.value.raw += `</${nodeName}>`;
 			} else {
 				state.quasi.value.raw += '/>';
 			}
diff --git a/test/js/samples/svelte-element-svg/input.svelte b/test/js/samples/svelte-element-svg/input.svelte
index 2dc4d54814..111c0183c6 100644
--- a/test/js/samples/svelte-element-svg/input.svelte
+++ b/test/js/samples/svelte-element-svg/input.svelte
@@ -1,3 +1,7 @@
-<svelte:element this="svg" xmlns="http://www.w3.org/2000/svg">
-    <svelte:element this="path" xmlns="http://www.w3.org/2000/svg"></svelte:element>
-</svelte:element>
\ No newline at end of file
+<script>
+	const tag = { svg: 'svg', path: 'path' };
+</script>
+
+<svelte:element this={tag.svg} xmlns="http://www.w3.org/2000/svg">
+	<svelte:element this={tag.path} xmlns="http://www.w3.org/2000/svg" />
+</svelte:element>
diff --git a/test/runtime/samples/static-svelte-element/_config.js b/test/runtime/samples/static-svelte-element/_config.js
new file mode 100644
index 0000000000..a26de61338
--- /dev/null
+++ b/test/runtime/samples/static-svelte-element/_config.js
@@ -0,0 +1,13 @@
+export default {
+	html: `
+		<div>
+			<p></p>
+		</div>
+	`,
+
+	test({ assert, target }) {
+		const p = target.querySelector('p');
+
+		assert.notEqual(p, undefined);
+	}
+};
diff --git a/test/runtime/samples/static-svelte-element/main.svelte b/test/runtime/samples/static-svelte-element/main.svelte
new file mode 100644
index 0000000000..3bdf853a5a
--- /dev/null
+++ b/test/runtime/samples/static-svelte-element/main.svelte
@@ -0,0 +1,3 @@
+<div>
+	<svelte:element this="p" />
+</div>
diff --git a/test/runtime/samples/static-svelte-element2/_config.js b/test/runtime/samples/static-svelte-element2/_config.js
new file mode 100644
index 0000000000..a26de61338
--- /dev/null
+++ b/test/runtime/samples/static-svelte-element2/_config.js
@@ -0,0 +1,13 @@
+export default {
+	html: `
+		<div>
+			<p></p>
+		</div>
+	`,
+
+	test({ assert, target }) {
+		const p = target.querySelector('p');
+
+		assert.notEqual(p, undefined);
+	}
+};
diff --git a/test/runtime/samples/static-svelte-element2/main.svelte b/test/runtime/samples/static-svelte-element2/main.svelte
new file mode 100644
index 0000000000..a723b955d4
--- /dev/null
+++ b/test/runtime/samples/static-svelte-element2/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	const p = 'p';
+</script>
+
+<div>
+	<svelte:element this={p} />
+</div>