svelte Architecture Docs
Home / File/ hydration.js — svelte Source File

hydration.js — svelte Source File

Architecture documentation for hydration.js, a javascript file in the svelte codebase. 5 imports, 28 dependents.

File javascript ClientRuntime Hydration 5 imports 28 dependents 8 functions

Entity Profile

Dependency Diagram

graph LR
  f3948b0d_b92a_0767_ba6c_832767f4e2bb["hydration.js"]
  73865c3c_2786_c9ac_d34f_b51d28b3a29e["constants.js"]
  f3948b0d_b92a_0767_ba6c_832767f4e2bb --> 73865c3c_2786_c9ac_d34f_b51d28b3a29e
  df278ca2_0a6c_fefe_09f2_b397500fe3c2["warnings.js"]
  f3948b0d_b92a_0767_ba6c_832767f4e2bb --> df278ca2_0a6c_fefe_09f2_b397500fe3c2
  9a9bbc27_46b6_021c_6d77_f736ed4b40f0["operations.js"]
  f3948b0d_b92a_0767_ba6c_832767f4e2bb --> 9a9bbc27_46b6_021c_6d77_f736ed4b40f0
  4776c976_30bb_448d_921d_ee70a7fa0135["get_next_sibling"]
  f3948b0d_b92a_0767_ba6c_832767f4e2bb --> 4776c976_30bb_448d_921d_ee70a7fa0135
  54c2bfce_50b6_b8cc_4371_e1e14f283fb3["constants"]
  f3948b0d_b92a_0767_ba6c_832767f4e2bb --> 54c2bfce_50b6_b8cc_4371_e1e14f283fb3
  3ab252dc_d6ce_1bc4_5889_915271359ea9["elements.js"]
  3ab252dc_d6ce_1bc4_5889_915271359ea9 --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  dd70ba52_70b9_64ef_66d0_34ac556ec3da["hmr.js"]
  dd70ba52_70b9_64ef_66d0_34ac556ec3da --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  0ae9bf62_aa68_bcd6_7a5c_a9620e877659["async.js"]
  0ae9bf62_aa68_bcd6_7a5c_a9620e877659 --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  277e61a1_318f_c1a6_cf40_f6e1a0f3aa2f["await.js"]
  277e61a1_318f_c1a6_cf40_f6e1a0f3aa2f --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  6d3d606a_fb7a_54af_1ece_f1eb12f174d1["boundary.js"]
  6d3d606a_fb7a_54af_1ece_f1eb12f174d1 --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  ee9aaeee_d18b_8f23_1c50_ace68f975516["branches.js"]
  ee9aaeee_d18b_8f23_1c50_ace68f975516 --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  4d06167e_1009_096b_88b0_99ef50b8fbad["css-props.js"]
  4d06167e_1009_096b_88b0_99ef50b8fbad --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  ca0d28d0_c4b0_db5c_32c9_bdad64d5deaa["each.js"]
  ca0d28d0_c4b0_db5c_32c9_bdad64d5deaa --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  9c9641c6_8e9b_282d_184f_5515feedb7b5["html.js"]
  9c9641c6_8e9b_282d_184f_5515feedb7b5 --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  style f3948b0d_b92a_0767_ba6c_832767f4e2bb fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/** @import { TemplateNode } from '#client' */

import { COMMENT_NODE } from '#client/constants';
import {
	HYDRATION_END,
	HYDRATION_ERROR,
	HYDRATION_START,
	HYDRATION_START_ELSE
} from '../../../constants.js';
import * as w from '../warnings.js';
import { get_next_sibling } from './operations.js';

/**
 * Use this variable to guard everything related to hydration code so it can be treeshaken out
 * if the user doesn't use the `hydrate` method and these code paths are therefore not needed.
 */
export let hydrating = false;

/** @param {boolean} value */
export function set_hydrating(value) {
	hydrating = value;
}

/**
 * The node that is currently being hydrated. This starts out as the first node inside the opening
 * <!--[--> comment, and updates each time a component calls `$.child(...)` or `$.sibling(...)`.
 * When entering a block (e.g. `{#if ...}`), `hydrate_node` is the block opening comment; by the
 * time we leave the block it is the closing comment, which serves as the block's anchor.
 * @type {TemplateNode}
 */
export let hydrate_node;

/** @param {TemplateNode | null} node */
export function set_hydrate_node(node) {
	if (node === null) {
		w.hydration_mismatch();
		throw HYDRATION_ERROR;
	}

	return (hydrate_node = node);
}

export function hydrate_next() {
	return set_hydrate_node(get_next_sibling(hydrate_node));
}

/** @param {TemplateNode} node */
export function reset(node) {
	if (!hydrating) return;

	// If the node has remaining siblings, something has gone wrong
	if (get_next_sibling(hydrate_node) !== null) {
		w.hydration_mismatch();
		throw HYDRATION_ERROR;
	}

	hydrate_node = node;
}

/**
// ... (66 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does hydration.js do?
hydration.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 hydration.js?
hydration.js defines 8 function(s): hydrate_next, hydrate_template, next, read_hydration_instruction, reset, set_hydrate_node, set_hydrating, skip_nodes.
What does hydration.js depend on?
hydration.js imports 5 module(s): constants, constants.js, get_next_sibling, operations.js, warnings.js.
What files import hydration.js?
hydration.js is imported by 28 file(s): async.js, attributes.js, await.js, boundary.js, branches.js, class.js, css-props.js, customizable-select.js, and 20 more.
Where is hydration.js in the architecture?
hydration.js is located at packages/svelte/src/internal/client/dom/hydration.js (domain: ClientRuntime, subdomain: Hydration, directory: packages/svelte/src/internal/client/dom).

Analyze Your Own Codebase

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

Try Supermodel Free