renderAstroComponent() — astro Function Reference

Architecture documentation for the renderAstroComponent() function in component.ts from the astro codebase.

Function typescript CoreAstro RenderingEngine called by 1

Entity Profile

CoreAstro→ RenderingEngine→ renderAstroComponent() — astro Function Reference

Dependency Diagram

graph TD
  861f20ba_fad0_c4de_c8fc_720d824ef3e0["renderAstroComponent()"]
  8fc97f1b_c914_c155_013d_cbd729fb6b4f["component.ts"]
  861f20ba_fad0_c4de_c8fc_720d824ef3e0 -->|defined in| 8fc97f1b_c914_c155_013d_cbd729fb6b4f
  94f21ea8_f0e7_2f4c_ee40_699f26c9ede0["renderComponent()"]
  94f21ea8_f0e7_2f4c_ee40_699f26c9ede0 -->|calls| 861f20ba_fad0_c4de_c8fc_720d824ef3e0
  style 861f20ba_fad0_c4de_c8fc_720d824ef3e0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/astro/src/runtime/server/render/component.ts lines 438–461

function renderAstroComponent(
	result: SSRResult,
	displayName: string,
	Component: AstroComponentFactory,
	props: Record<string | number, any>,
	slots: any = {},
): RenderInstance {
	if (containsServerDirective(props)) {
		const serverIslandComponent = new ServerIslandComponent(result, props, slots, displayName);
		result._metadata.propagators.add(serverIslandComponent);
		return serverIslandComponent;
	}

	const instance = createAstroComponentInstance(result, displayName, Component, props, slots);

	return {
		render(destination: RenderDestination): Promise<void> | void {
			// NOTE: This render call can't be pre-invoked outside of this function as it'll also initialize the slots
			// recursively, which causes each Astro components in the tree to be called bottom-up, and is incorrect.
			// The slots are initialized eagerly for head propagation.
			return instance.render(destination);
		},
	};
}