Home / File/ render.js — svelte Source File

render.js — svelte Source File

Architecture documentation for render.js, a javascript file in the svelte codebase. 29 imports, 4 dependents.

File javascript ClientRuntime Hydration 29 imports 4 dependents 6 functions

Entity Profile

Dependency Diagram

graph LR
  deb813bb_c5d2_3dfd_2554_606359abaa83["render.js"]
  9a9bbc27_46b6_021c_6d77_f736ed4b40f0["operations.js"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 9a9bbc27_46b6_021c_6d77_f736ed4b40f0
  7bff6ec5_15bb_4289_1bd5_99cb794400ed["clear_text_content"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 7bff6ec5_15bb_4289_1bd5_99cb794400ed
  ec54e18a_a454_5d8c_9e00_7bc16e4f49c4["create_text"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> ec54e18a_a454_5d8c_9e00_7bc16e4f49c4
  f3bd5a62_2879_ccbe_7046_712cbf9eeaab["get_first_child"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> f3bd5a62_2879_ccbe_7046_712cbf9eeaab
  4776c976_30bb_448d_921d_ee70a7fa0135["get_next_sibling"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 4776c976_30bb_448d_921d_ee70a7fa0135
  a413fb77_0391_6be3_509e_911e3ab4e488["init_operations"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> a413fb77_0391_6be3_509e_911e3ab4e488
  73865c3c_2786_c9ac_d34f_b51d28b3a29e["constants.js"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 73865c3c_2786_c9ac_d34f_b51d28b3a29e
  bde4209f_8ffc_1594_4024_b1835a44bcf6["runtime.js"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> bde4209f_8ffc_1594_4024_b1835a44bcf6
  48cf26f8_bf34_fd7a_3d52_cc963051e167["context.js"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 48cf26f8_bf34_fd7a_3d52_cc963051e167
  ea5280ff_3b87_42ee_3823_3570b76a5779["push"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> ea5280ff_3b87_42ee_3823_3570b76a5779
  7114b424_5006_2886_1565_8d8123ef1ad8["pop"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 7114b424_5006_2886_1565_8d8123ef1ad8
  1ae6fa4e_16ee_acdf_5e28_17eb0819fddb["effects.js"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 1ae6fa4e_16ee_acdf_5e28_17eb0819fddb
  0448eaeb_2934_f939_a81e_5b59a8c48202["component_root"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> 0448eaeb_2934_f939_a81e_5b59a8c48202
  f3948b0d_b92a_0767_ba6c_832767f4e2bb["hydration.js"]
  deb813bb_c5d2_3dfd_2554_606359abaa83 --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  style deb813bb_c5d2_3dfd_2554_606359abaa83 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/** @import { ComponentContext, Effect, EffectNodes, TemplateNode } from '#client' */
/** @import { Component, ComponentType, SvelteComponent, MountOptions } from '../../index.js' */
import { DEV } from 'esm-env';
import {
	clear_text_content,
	create_text,
	get_first_child,
	get_next_sibling,
	init_operations
} from './dom/operations.js';
import { HYDRATION_END, HYDRATION_ERROR, HYDRATION_START } from '../../constants.js';
import { active_effect } from './runtime.js';
import { push, pop, component_context } from './context.js';
import { component_root } from './reactivity/effects.js';
import { hydrate_node, hydrating, set_hydrate_node, set_hydrating } from './dom/hydration.js';
import { array_from } from '../shared/utils.js';
import {
	all_registered_events,
	handle_event_propagation,
	root_event_handles
} from './dom/elements/events.js';
import * as w from './warnings.js';
import * as e from './errors.js';
import { assign_nodes } from './dom/template.js';
import { is_passive_event } from '../../utils.js';
import { COMMENT_NODE, STATE_SYMBOL } from './constants.js';
import { boundary } from './dom/blocks/boundary.js';

/**
 * This is normally true — block effects should run their intro transitions —
 * but is false during hydration (unless `options.intro` is `true`) and
 * when creating the children of a `<svelte:element>` that just changed tag
 */
export let should_intro = true;

/** @param {boolean} value */
export function set_should_intro(value) {
	should_intro = value;
}

/**
 * @param {Element} text
 * @param {string} value
 * @returns {void}
 */
export function set_text(text, value) {
	// For objects, we apply string coercion (which might make things like $state array references in the template reactive) before diffing
	var str = value == null ? '' : typeof value === 'object' ? value + '' : value;
	// @ts-expect-error
	if (str !== (text.__t ??= text.nodeValue)) {
		// @ts-expect-error
		text.__t = str;
		text.nodeValue = str + '';
	}
}

/**
 * Mounts a component to the given target and returns the exports and potentially the props (if compiled with `accessors: true`) of the component.
 * Transitions will play during the initial render unless the `intro` option is set to `false`.
 *
// ... (256 more lines)

Domain

Subdomains

Frequently Asked Questions

What does render.js do?
render.js is a source file in the svelte codebase, written in javascript. It belongs to the ClientRuntime domain, Hydration subdomain.
What functions are defined in render.js?
render.js defines 6 function(s): _mount, hydrate, mount, set_should_intro, set_text, unmount.
What does render.js depend on?
render.js imports 29 module(s): assign_nodes, boundary, boundary.js, clear_text_content, component_root, constants.js, constants.js, context.js, and 21 more.
What files import render.js?
render.js is imported by 4 file(s): hmr.js, legacy-client.js, svelte-element.js, transitions.js.
Where is render.js in the architecture?
render.js is located at packages/svelte/src/internal/client/render.js (domain: ClientRuntime, subdomain: Hydration, directory: packages/svelte/src/internal/client).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free