diff --git a/src/compiler/compile/render_ssr/Renderer.ts b/src/compiler/compile/render_ssr/Renderer.ts index 952f4a4adb..0e4724ea0e 100644 --- a/src/compiler/compile/render_ssr/Renderer.ts +++ b/src/compiler/compile/render_ssr/Renderer.ts @@ -16,6 +16,7 @@ import Title from './handlers/Title'; import { AppendTarget, CompileOptions } from '../../interfaces'; import { INode } from '../nodes/interfaces'; import { Expression, TemplateLiteral, Identifier } from 'estree'; +import { collapse_template_literal } from '../utils/collapse_template_literal'; import { escape_template } from '../utils/stringify'; type Handler = (node: any, renderer: Renderer, options: CompileOptions) => void; @@ -107,7 +108,7 @@ export default class Renderer { } // Optimize the TemplateLiteral to remove unnecessary nodes - collapse_literal(popped.literal); + collapse_template_literal(popped.literal); return popped.literal; } @@ -125,37 +126,3 @@ export default class Renderer { } } -// Collapse string literals together -function collapse_literal(literal: TemplateLiteral) { - if (literal.quasis.length) { - // flatMap() to produce an array containing [quasi, expr, quasi, expr, ..., quasi] - const zip = literal.quasis.reduce((acc, cur, index) => { - const expr = literal.expressions[index]; - acc.push(cur); - if (expr) { - acc.push(expr); - } - return acc; - }, []); - - // If an expression is a simple string literal, combine it with its preceeding - // and following quasi - let curQuasi = zip[0]; - const newZip = [curQuasi]; - for (let i = 1; i < zip.length; i += 2) { - const expr = zip[i]; - const nextQuasi = zip[i + 1]; - if (expr.type === 'Literal' && typeof expr.value === 'string') { - curQuasi.value.raw += escape_template(expr.value) + nextQuasi.value.raw; - } else { - newZip.push(expr); - newZip.push(nextQuasi); - curQuasi = nextQuasi; - } - } - - // Reconstitute the quasi and expressions arrays - literal.quasis = newZip.filter((_, index) => index % 2 === 0); - literal.expressions = newZip.filter((_, index) => index % 2 === 1); - } -} diff --git a/src/compiler/compile/utils/collapse_template_literal.ts b/src/compiler/compile/utils/collapse_template_literal.ts new file mode 100644 index 0000000000..bace266ce5 --- /dev/null +++ b/src/compiler/compile/utils/collapse_template_literal.ts @@ -0,0 +1,37 @@ +import { TemplateLiteral } from 'estree'; +import { escape_template } from './stringify'; + +// Collapse string literals together +export function collapse_template_literal(literal: TemplateLiteral) { + if (literal.quasis.length) { + // flatMap() to produce an array containing [quasi, expr, quasi, expr, ..., quasi] + const zip = literal.quasis.reduce((acc, cur, index) => { + const expr = literal.expressions[index]; + acc.push(cur); + if (expr) { + acc.push(expr); + } + return acc; + }, []); + + // If an expression is a simple string literal, combine it with its preceding + // and following quasi + let cur_quasi = zip[0]; + const new_zip = [cur_quasi]; + for (let i = 1; i < zip.length; i += 2) { + const expr = zip[i]; + const next_quasi = zip[i + 1]; + if (expr.type === 'Literal' && typeof expr.value === 'string') { + cur_quasi.value.raw += escape_template(expr.value) + next_quasi.value.raw; + } else { + new_zip.push(expr); + new_zip.push(next_quasi); + cur_quasi = next_quasi; + } + } + + // Reconstitute the quasi and expressions arrays + literal.quasis = new_zip.filter((_, index) => index % 2 === 0); + literal.expressions = new_zip.filter((_, index) => index % 2 === 1); + } +} diff --git a/test/js/samples/collapse-literal-ssr/_config.js b/test/js/samples/collapse-literal-ssr/_config.js new file mode 100644 index 0000000000..c4070b9a3b --- /dev/null +++ b/test/js/samples/collapse-literal-ssr/_config.js @@ -0,0 +1,6 @@ +export default { + options: { + generate: 'ssr', + dev: true + } +}; diff --git a/test/js/samples/collapse-literal-ssr/expected.js b/test/js/samples/collapse-literal-ssr/expected.js new file mode 100644 index 0000000000..ee431fb51d --- /dev/null +++ b/test/js/samples/collapse-literal-ssr/expected.js @@ -0,0 +1,28 @@ +/* generated by Svelte vX.Y.Z */ +import { add_attribute, create_ssr_component, escape } from "svelte/internal"; + +const const1 = 1; +const const2 = 'const2'; + +function foo() { + return ''; +} + +const Component = create_ssr_component(($$result, $$props, $$bindings, slots) => { + return ` +
-
+ + +- +- +- +- +- + + +
-
+
-
+
-
`; +}); + +export default Component; \ No newline at end of file diff --git a/test/js/samples/collapse-literal-ssr/input.svelte b/test/js/samples/collapse-literal-ssr/input.svelte new file mode 100644 index 0000000000..9c2826d0e2 --- /dev/null +++ b/test/js/samples/collapse-literal-ssr/input.svelte @@ -0,0 +1,23 @@ + + + +
-
+ + +
-
+
-
+
-
+
-
+
-
+ + +
-
+
-
+
-