RenderTag() — svelte Function Reference

Architecture documentation for the RenderTag() function in RenderTag.js from the svelte codebase.

Function javascript Compiler Transformer calls 3

Entity Profile

Compiler→ Transformer→ RenderTag() — svelte Function Reference

Dependency Diagram

graph TD
  50bb3f4c_6d1d_faae_29ca_3215725af2b1["RenderTag()"]
  732df1b1_b4c7_ad36_c716_bfd0aee4083c["RenderTag.js"]
  50bb3f4c_6d1d_faae_29ca_3215725af2b1 -->|defined in| 732df1b1_b4c7_ad36_c716_bfd0aee4083c
  9bcad0f1_2e1e_1fe2_1a87_0967adb89be8["unwrap_optional()"]
  50bb3f4c_6d1d_faae_29ca_3215725af2b1 -->|calls| 9bcad0f1_2e1e_1fe2_1a87_0967adb89be8
  7048cd7e_3fd1_ae4c_a573_68a6ebe889e9["render_block()"]
  50bb3f4c_6d1d_faae_29ca_3215725af2b1 -->|calls| 7048cd7e_3fd1_ae4c_a573_68a6ebe889e9
  c5103d74_690b_5e58_b211_85c417500d79["is_async()"]
  50bb3f4c_6d1d_faae_29ca_3215725af2b1 -->|calls| c5103d74_690b_5e58_b211_85c417500d79
  style 50bb3f4c_6d1d_faae_29ca_3215725af2b1 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/src/compiler/phases/3-transform/server/visitors/RenderTag.js lines 12–45

export function RenderTag(node, context) {
	const optimiser = new PromiseOptimiser();

	const callee = unwrap_optional(node.expression).callee;
	const raw_args = unwrap_optional(node.expression).arguments;

	const snippet_function = optimiser.transform(
		/** @type {Expression} */ (context.visit(callee)),
		node.metadata.expression
	);

	const snippet_args = raw_args.map((arg, i) => {
		return optimiser.transform(
			/** @type {Expression} */ (context.visit(arg)),
			node.metadata.arguments[i]
		);
	});

	let statement = b.stmt(
		(node.expression.type === 'CallExpression' ? b.call : b.maybe_call)(
			snippet_function,
			b.id('$$renderer'),
			...snippet_args
		)
	);

	context.state.template.push(...optimiser.render_block([statement]));

	// If the render tag is wrapped in $.async, that $.async call already contains surrounding markers,
	// so we don't need to (or rather must not, to avoid hydration mismatches) add our own.
	if (!optimiser.is_async() && !context.state.is_standalone) {
		context.state.template.push(empty_comment);
	}
}