msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

simplify

Browse Source
aa-coordination
Rich Harris 8 months ago
parent 6e1a33162c
commit 5f61b08849
2 changed files with 69 additions and 70 deletions
Show Stats Download Patch File Download Diff File

109
packages/svelte/src/internal/client/dom/blocks/html.js
Unescape View File

@ -1,6 +1,6 @@
/** @import { Effect, TemplateNode } from '#client' */
import { FILENAME, HYDRATION_ERROR } from '../../../../constants.js';
import { branch, destroy_effect, template_effect } from '../../reactivity/effects.js';
import { remove_effect_dom, template_effect } from '../../reactivity/effects.js';
import { hydrate_next, hydrate_node, hydrating, set_hydrate_node } from '../hydration.js';
import { create_fragment_from_html } from '../reconciler.js';
import { assign_nodes } from '../template.js';
@ -9,6 +9,7 @@ import { hash, sanitize_location } from '../../../../utils.js';
import { DEV } from 'esm-env';
import { dev_current_component_function } from '../../context.js';
import { get_first_child, get_next_sibling } from '../operations.js';
import { active_effect } from '../../runtime.js';
/**
* @param {Element} element
@ -44,77 +45,71 @@ export function html(node, get_value, svg = false, mathml = false, skip_warning
var value = '';
/** @type {Effect | undefined} */
var effect;
template_effect(() => {
var effect = /** @type {Effect} */ (active_effect);
if (value === (value = get_value() ?? '')) {
if (hydrating) hydrate_next();
return;
}
if (effect !== undefined) {
destroy_effect(effect);
effect = undefined;
if (effect.nodes_start !== null) {
remove_effect_dom(effect.nodes_start, /** @type {TemplateNode} */ (effect.nodes_end));
effect.nodes_start = effect.nodes_end = null;
}
if (value === '') return;
effect = branch(() => {
if (hydrating) {
// We're deliberately not trying to repair mismatches between server and client,
// as it's costly and error-prone (and it's an edge case to have a mismatch anyway)
var hash = /** @type {Comment} */ (hydrate_node).data;
var next = hydrate_next();
var last = next;
while (
next !== null &&
(next.nodeType !== 8 || /** @type {Comment} */ (next).data !== '')
) {
last = next;
next = /** @type {TemplateNode} */ (get_next_sibling(next));
}
if (next === null) {
w.hydration_mismatch();
throw HYDRATION_ERROR;
}
if (DEV && !skip_warning) {
check_hash(/** @type {Element} */ (next.parentNode), hash, value);
}
assign_nodes(hydrate_node, last);
anchor = set_hydrate_node(next);
return;
}
if (hydrating) {
// We're deliberately not trying to repair mismatches between server and client,
// as it's costly and error-prone (and it's an edge case to have a mismatch anyway)
var hash = /** @type {Comment} */ (hydrate_node).data;
var next = hydrate_next();
var last = next;
var html = value + '';
if (svg) html = `<svg>${html}</svg>`;
else if (mathml) html = `<math>${html}</math>`;
while (next !== null && (next.nodeType !== 8 || /** @type {Comment} */ (next).data !== '')) {
last = next;
next = /** @type {TemplateNode} */ (get_next_sibling(next));
}
// Don't use create_fragment_with_script_from_html here because that would mean script tags are executed.
// @html is basically `.innerHTML = ...` and that doesn't execute scripts either due to security reasons.
/** @type {DocumentFragment | Element} */
var node = create_fragment_from_html(html);
if (next === null) {
w.hydration_mismatch();
throw HYDRATION_ERROR;
}
if (svg || mathml) {
node = /** @type {Element} */ (get_first_child(node));
if (DEV && !skip_warning) {
check_hash(/** @type {Element} */ (next.parentNode), hash, value);
}
assign_nodes(
/** @type {TemplateNode} */ (get_first_child(node)),
/** @type {TemplateNode} */ (node.lastChild)
);
if (svg || mathml) {
while (get_first_child(node)) {
anchor.before(/** @type {Node} */ (get_first_child(node)));
}
} else {
anchor.before(node);
assign_nodes(hydrate_node, last);
anchor = set_hydrate_node(next);
return;
}
var html = value + '';
if (svg) html = `<svg>${html}</svg>`;
else if (mathml) html = `<math>${html}</math>`;
// Don't use create_fragment_with_script_from_html here because that would mean script tags are executed.
// @html is basically `.innerHTML = ...` and that doesn't execute scripts either due to security reasons.
/** @type {DocumentFragment | Element} */
var node = create_fragment_from_html(html);
if (svg || mathml) {
node = /** @type {Element} */ (get_first_child(node));
}
assign_nodes(
/** @type {TemplateNode} */ (get_first_child(node)),
/** @type {TemplateNode} */ (node.lastChild)
);
if (svg || mathml) {
while (get_first_child(node)) {
anchor.before(/** @type {Node} */ (get_first_child(node)));
}
});
} else {
anchor.before(node);
}
});
}

30
packages/svelte/src/internal/client/reactivity/effects.js vendored
Unescape View File

@ -388,7 +388,7 @@ function create_template_effect(fn, deriveds) {
});
}
block(effect, TEMPLATE_EFFECT);
create_effect(RENDER_EFFECT | TEMPLATE_EFFECT, effect, true);
}
/**
@ -467,18 +467,7 @@ export function destroy_effect(effect, remove_dom = true) {
var removed = false;
if ((remove_dom || (effect.f & HEAD_EFFECT) !== 0) && effect.nodes_start !== null) {
/** @type {TemplateNode | null} */
var node = effect.nodes_start;
var end = effect.nodes_end;
while (node !== null) {
/** @type {TemplateNode | null} */
var next = node === end ? null : /** @type {TemplateNode} */ (get_next_sibling(node));
node.remove();
node = next;
}
remove_effect_dom(effect.nodes_start, /** @type {TemplateNode} */ (effect.nodes_end));
removed = true;
}
@ -520,6 +509,21 @@ export function destroy_effect(effect, remove_dom = true) {
null;
}
/**
*
* @param {TemplateNode | null} node
* @param {TemplateNode} end
*/
export function remove_effect_dom(node, end) {
while (node !== null) {
/** @type {TemplateNode | null} */
var next = node === end ? null : /** @type {TemplateNode} */ (get_next_sibling(node));
node.remove();
node = next;
}
}
/**
* Detach an effect from the effect tree, freeing up memory and
* reducing the amount of work that happens on subsequent traversals

Write Preview
Loading…
Cancel
Save