From 4f12846fdfd5c8abfea3206cb878ef2c55a59f95 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sat, 8 Jun 2024 09:02:52 -0400
Subject: [PATCH] feat: more efficient output for attributes in SSR (#11949)

* feat: more efficient output for attributes in SSR

* rename arg
---
 .changeset/spotty-crabs-give.md                           | 5 +++++
 .../phases/3-transform/server/transform-server.js         | 2 +-
 packages/svelte/src/internal/server/index.js              | 8 ++++----
 .../_expected/server/main.svelte.js                       | 2 +-
 .../state-proxy-literal/_expected/server/index.svelte.js  | 2 +-
 5 files changed, 12 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/spotty-crabs-give.md

diff --git a/.changeset/spotty-crabs-give.md b/.changeset/spotty-crabs-give.md
new file mode 100644
index 0000000000..e66efd52d8
--- /dev/null
+++ b/.changeset/spotty-crabs-give.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+feat: more efficient output for attributes in SSR
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js
index eb04cd9397..50044931d2 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js
@@ -2059,7 +2059,7 @@ function serialize_element_attributes(node, context) {
 			);
 
 			context.state.template.push(
-				t_expression(b.call('$.attr', b.literal(name), value, b.literal(is_boolean)))
+				t_expression(b.call('$.attr', b.literal(name), value, is_boolean && b.literal(is_boolean)))
 			);
 		}
 	}
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index 7f7b0ebe98..a6c41df5ce 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -143,12 +143,12 @@ export function head(payload, fn) {
  * @template V
  * @param {string} name
  * @param {V} value
- * @param {boolean} boolean
+ * @param {boolean} [is_boolean]
  * @returns {string}
  */
-export function attr(name, value, boolean) {
-	if (value == null || (!value && boolean) || (value === '' && name === 'class')) return '';
-	const assignment = boolean ? '' : `="${escape_html(value, true)}"`;
+export function attr(name, value, is_boolean = false) {
+	if (value == null || (!value && is_boolean) || (value === '' && name === 'class')) return '';
+	const assignment = is_boolean ? '' : `="${escape_html(value, true)}"`;
 	return ` ${name}${assignment}`;
 }
 
diff --git a/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/server/main.svelte.js b/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/server/main.svelte.js
index c042178844..5eaa55aa49 100644
--- a/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/server/main.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/dynamic-attributes-casing/_expected/server/main.svelte.js
@@ -5,5 +5,5 @@ export default function Main($$payload) {
 	let x = 'test';
 	let y = () => 'test';
 
-	$$payload.out += `<div${$.attr("foobar", x, false)}></div> <svg${$.attr("viewBox", x, false)}></svg> <custom-element${$.attr("foobar", x, false)}></custom-element> <div${$.attr("foobar", y(), false)}></div> <svg${$.attr("viewBox", y(), false)}></svg> <custom-element${$.attr("foobar", y(), false)}></custom-element>`;
+	$$payload.out += `<div${$.attr("foobar", x)}></div> <svg${$.attr("viewBox", x)}></svg> <custom-element${$.attr("foobar", x)}></custom-element> <div${$.attr("foobar", y())}></div> <svg${$.attr("viewBox", y())}></svg> <custom-element${$.attr("foobar", y())}></custom-element>`;
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/server/index.svelte.js
index 6e96cf8238..3424f807ab 100644
--- a/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/server/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/state-proxy-literal/_expected/server/index.svelte.js
@@ -11,5 +11,5 @@ export default function State_proxy_literal($$payload) {
 		tpl = ``;
 	}
 
-	$$payload.out += `<input${$.attr("value", str, false)}> <input${$.attr("value", tpl, false)}> <button>reset</button>`;
+	$$payload.out += `<input${$.attr("value", str)}> <input${$.attr("value", tpl)}> <button>reset</button>`;
 }
\ No newline at end of file