render() — svelte Function Reference
Architecture documentation for the render() function in renderer.js from the svelte codebase.
Entity Profile
Dependency Diagram
graph TD ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274["render()"] ce85d155_9f13_f67c_9824_407161a6c2c7["Renderer"] ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 -->|defined in| ce85d155_9f13_f67c_9824_407161a6c2c7 91da79a6_48be_3e67_5beb_aa47cf753c81["render()"] 91da79a6_48be_3e67_5beb_aa47cf753c81 -->|calls| ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 37596f8a_06e9_abf9_49d1_df75cd4a3a2d["component()"] 37596f8a_06e9_abf9_49d1_df75cd4a3a2d -->|calls| ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 91da79a6_48be_3e67_5beb_aa47cf753c81["render()"] ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 -->|calls| 91da79a6_48be_3e67_5beb_aa47cf753c81 eda2c9d4_ed45_87f9_a50b_04caf82c0540["init_render_context()"] ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 -->|calls| eda2c9d4_ed45_87f9_a50b_04caf82c0540 eb2eff5c_d275_f195_beec_ce46ba591862["with_render_context()"] ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 -->|calls| eb2eff5c_d275_f195_beec_ce46ba591862 3ac11615_66ca_aa9d_0f54_870b340007d5["html_deprecated()"] ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 -->|calls| 3ac11615_66ca_aa9d_0f54_870b340007d5 style ec1e5dc3_f338_7d6e_42e9_7a43e9c5c274 fill:#6366f1,stroke:#818cf8,color:#fff
Relationship Graph
Source Code
packages/svelte/src/internal/server/renderer.js lines 400–468
static render(component, options = {}) {
/** @type {AccumulatedContent | undefined} */
let sync;
/** @type {Promise<AccumulatedContent & { hashes: { script: Sha256Source[] } }> | undefined} */
let async;
const result = /** @type {RenderOutput} */ ({});
// making these properties non-enumerable so that console.logging
// doesn't trigger a sync render
Object.defineProperties(result, {
html: {
get: () => {
return (sync ??= Renderer.#render(component, options)).body;
}
},
head: {
get: () => {
return (sync ??= Renderer.#render(component, options)).head;
}
},
body: {
get: () => {
return (sync ??= Renderer.#render(component, options)).body;
}
},
hashes: {
value: {
script: ''
}
},
then: {
value:
/**
* this is not type-safe, but honestly it's the best I can do right now, and it's a straightforward function.
*
* @template TResult1
* @template [TResult2=never]
* @param { (value: SyncRenderOutput) => TResult1 } onfulfilled
* @param { (reason: unknown) => TResult2 } onrejected
*/
(onfulfilled, onrejected) => {
if (!async_mode_flag) {
const result = (sync ??= Renderer.#render(component, options));
const user_result = onfulfilled({
head: result.head,
body: result.body,
html: result.body,
hashes: { script: [] }
});
return Promise.resolve(user_result);
}
async ??= init_render_context().then(() =>
with_render_context(() => Renderer.#render_async(component, options))
);
return async.then((result) => {
Object.defineProperty(result, 'html', {
// eslint-disable-next-line getter-return
get: () => {
e.html_deprecated();
}
});
return onfulfilled(/** @type {SyncRenderOutput} */ (result));
}, onrejected);
}
}
});
return result;
}
Domain
Subdomains
Called By
Source
Frequently Asked Questions
What does render() do?
render() is a function in the svelte codebase, defined in packages/svelte/src/internal/server/renderer.js.
Where is render() defined?
render() is defined in packages/svelte/src/internal/server/renderer.js at line 400.
What does render() call?
render() calls 4 function(s): html_deprecated, init_render_context, render, with_render_context.
What calls render()?
render() is called by 2 function(s): component, render.
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free