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

template.js — svelte Source File

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

File javascript ClientRuntime Hydration 17 imports 5 dependents 13 functions

Entity Profile

Dependency Diagram

graph LR
  2ab7c579_f011_f472_7847_c9e9979c6b2a["template.js"]
  f3948b0d_b92a_0767_ba6c_832767f4e2bb["hydration.js"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> f3948b0d_b92a_0767_ba6c_832767f4e2bb
  b31601aa_35ce_7827_5394_99fb97fa27d2["hydrate_next"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> b31601aa_35ce_7827_5394_99fb97fa27d2
  40f27ad3_30bb_8f2a_3fb3_757088cf7428["set_hydrate_node"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> 40f27ad3_30bb_8f2a_3fb3_757088cf7428
  9a9bbc27_46b6_021c_6d77_f736ed4b40f0["operations.js"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> 9a9bbc27_46b6_021c_6d77_f736ed4b40f0
  ec54e18a_a454_5d8c_9e00_7bc16e4f49c4["create_text"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> ec54e18a_a454_5d8c_9e00_7bc16e4f49c4
  f3bd5a62_2879_ccbe_7046_712cbf9eeaab["get_first_child"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> f3bd5a62_2879_ccbe_7046_712cbf9eeaab
  4776c976_30bb_448d_921d_ee70a7fa0135["get_next_sibling"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> 4776c976_30bb_448d_921d_ee70a7fa0135
  e4e52826_98b2_5b51_9187_77e2fcc4adbb["create_element"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> e4e52826_98b2_5b51_9187_77e2fcc4adbb
  37e01e79_1cb8_e9dd_773c_5301bb72975c["create_fragment"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> 37e01e79_1cb8_e9dd_773c_5301bb72975c
  ad2d3e5b_92c4_44cd_6972_84b884432025["create_comment"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> ad2d3e5b_92c4_44cd_6972_84b884432025
  f4910c1d_4706_d871_1b71_4336dcb2d00c["set_attribute"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> f4910c1d_4706_d871_1b71_4336dcb2d00c
  2471b414_d833_0bea_1bc7_b19c0d8a6d6b["merge_text_nodes"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> 2471b414_d833_0bea_1bc7_b19c0d8a6d6b
  a156992a_4c74_fff0_8871_1aae7581b781["reconciler.js"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> a156992a_4c74_fff0_8871_1aae7581b781
  0fd60e7d_ad18_dc03_875d_13156cdee4b4["create_fragment_from_html"]
  2ab7c579_f011_f472_7847_c9e9979c6b2a --> 0fd60e7d_ad18_dc03_875d_13156cdee4b4
  style 2ab7c579_f011_f472_7847_c9e9979c6b2a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/** @import { Effect, EffectNodes, TemplateNode } from '#client' */
/** @import { TemplateStructure } from './types' */
import { hydrate_next, hydrate_node, hydrating, set_hydrate_node } from './hydration.js';
import {
	create_text,
	get_first_child,
	get_next_sibling,
	is_firefox,
	create_element,
	create_fragment,
	create_comment,
	set_attribute,
	merge_text_nodes
} from './operations.js';
import { create_fragment_from_html } from './reconciler.js';
import { active_effect } from '../runtime.js';
import {
	NAMESPACE_MATHML,
	NAMESPACE_SVG,
	TEMPLATE_FRAGMENT,
	TEMPLATE_USE_IMPORT_NODE,
	TEMPLATE_USE_MATHML,
	TEMPLATE_USE_SVG
} from '../../../constants.js';
import { COMMENT_NODE, DOCUMENT_FRAGMENT_NODE, EFFECT_RAN, TEXT_NODE } from '#client/constants';

/**
 * @param {TemplateNode} start
 * @param {TemplateNode | null} end
 */
export function assign_nodes(start, end) {
	var effect = /** @type {Effect} */ (active_effect);
	if (effect.nodes === null) {
		effect.nodes = { start, end, a: null, t: null };
	}
}

/**
 * @param {string} content
 * @param {number} flags
 * @returns {() => Node | Node[]}
 */
/*#__NO_SIDE_EFFECTS__*/
export function from_html(content, flags) {
	var is_fragment = (flags & TEMPLATE_FRAGMENT) !== 0;
	var use_import_node = (flags & TEMPLATE_USE_IMPORT_NODE) !== 0;

	/** @type {Node} */
	var node;

	/**
	 * Whether or not the first item is a text/element node. If not, we need to
	 * create an additional comment node to act as `effect.nodes.start`
	 */
	var has_start = !content.startsWith('<!>');

	return () => {
		if (hydrating) {
			assign_nodes(hydrate_node, null);
			return hydrate_node;
// ... (333 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does template.js do?
template.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 template.js?
template.js defines 13 function(s): append, assign_nodes, comment, fragment_from_tree, from_html, from_mathml, from_namespace, from_svg, from_tree, props_id, and 3 more.
What does template.js depend on?
template.js imports 17 module(s): constants, constants.js, create_comment, create_element, create_fragment, create_fragment_from_html, create_text, get_first_child, and 9 more.
What files import template.js?
template.js is imported by 5 file(s): custom-element.js, html.js, render.js, snippet.js, svelte-element.js.
Where is template.js in the architecture?
template.js is located at packages/svelte/src/internal/client/dom/template.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