Skip to content

Commit 1fc5f8b

Browse files
authored
chore: code-golf a bit (#10893)
1 parent dfd1819 commit 1fc5f8b

File tree

4 files changed

+20
-33
lines changed

4 files changed

+20
-33
lines changed

packages/svelte/scripts/check-treeshakeability.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@ const bundle = await bundle_code(
109109
).js.code
110110
);
111111

112-
if (!bundle.includes('current_hydration_fragment')) {
112+
if (!bundle.includes('hydrate_nodes')) {
113113
// eslint-disable-next-line no-console
114114
console.error(`✅ Hydration code treeshakeable`);
115115
} else {

packages/svelte/src/internal/client/dom/blocks/css-props.js

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -15,27 +15,26 @@ export function css_props(anchor, is_html, props, component) {
1515
hydrate_block_anchor(anchor);
1616

1717
/** @type {HTMLElement | SVGElement} */
18-
let tag;
18+
let element;
1919

2020
/** @type {Text | Comment} */
2121
let component_anchor;
2222

2323
if (hydrating) {
2424
// Hydration: css props element is surrounded by a ssr comment ...
25-
tag = /** @type {HTMLElement | SVGElement} */ (hydrate_nodes[0]);
25+
element = /** @type {HTMLElement | SVGElement} */ (hydrate_nodes[0]);
2626
// ... and the child(ren) of the css props element is also surround by a ssr comment
27-
component_anchor = /** @type {Comment} */ (tag.firstChild);
27+
component_anchor = /** @type {Comment} */ (element.firstChild);
2828
} else {
2929
if (is_html) {
30-
tag = document.createElement('div');
31-
tag.style.display = 'contents';
30+
element = document.createElement('div');
31+
element.style.display = 'contents';
3232
} else {
33-
tag = document.createElementNS(namespace_svg, 'g');
33+
element = document.createElementNS(namespace_svg, 'g');
3434
}
3535

36-
anchor.before(tag);
37-
component_anchor = empty();
38-
tag.appendChild(component_anchor);
36+
anchor.before(element);
37+
component_anchor = element.appendChild(empty());
3938
}
4039

4140
component(component_anchor);
@@ -48,18 +47,18 @@ export function css_props(anchor, is_html, props, component) {
4847

4948
for (const key in current_props) {
5049
if (!(key in next_props)) {
51-
tag.style.removeProperty(key);
50+
element.style.removeProperty(key);
5251
}
5352
}
5453

5554
for (const key in next_props) {
56-
tag.style.setProperty(key, next_props[key]);
55+
element.style.setProperty(key, next_props[key]);
5756
}
5857

5958
current_props = next_props;
6059
});
6160

6261
effect.ondestroy = () => {
63-
remove(tag);
62+
remove(element);
6463
};
6564
}

packages/svelte/src/internal/client/dom/blocks/svelte-head.js

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ export function head(render_fn) {
1818
update_hydrate_nodes(document.head.firstChild);
1919
}
2020

21+
var anchor = document.head.appendChild(empty());
22+
2123
try {
2224
/** @type {import('#client').Dom | null} */
2325
var dom = null;
@@ -28,13 +30,7 @@ export function head(render_fn) {
2830
head_effect.dom = dom = null;
2931
}
3032

31-
let anchor = null;
32-
if (!hydrating) {
33-
anchor = empty();
34-
document.head.appendChild(anchor);
35-
}
36-
37-
dom = render_fn(anchor) ?? null;
33+
dom = render_fn(hydrating ? null : anchor) ?? null;
3834
});
3935

4036
head_effect.ondestroy = () => {

packages/svelte/src/internal/client/render.js

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -114,8 +114,7 @@ export function createRoot() {
114114
* @returns {Exports}
115115
*/
116116
export function mount(component, options) {
117-
const anchor = empty();
118-
options.target.appendChild(anchor);
117+
const anchor = options.target.appendChild(empty());
119118
// Don't flush previous effects to ensure order of outer effects stays consistent
120119
return flush_sync(() => _mount(component, { ...options, anchor }), false);
121120
}
@@ -148,28 +147,21 @@ export function hydrate(component, options) {
148147
const nodes = update_hydrate_nodes(first_child, true);
149148
set_hydrating(true);
150149

151-
/** @type {null | Text} */
152-
let anchor = null;
153-
154-
if (nodes === null) {
155-
anchor = empty();
156-
container.appendChild(anchor);
157-
}
158-
159-
let finished_hydrating = false;
150+
let hydrated = false;
160151

161152
try {
162153
// Don't flush previous effects to ensure order of outer effects stays consistent
163154
return flush_sync(() => {
155+
const anchor = nodes === null ? container.appendChild(empty()) : null;
164156
const instance = _mount(component, { ...options, anchor });
165157
// flush_sync will run this callback and then synchronously run any pending effects,
166158
// which don't belong to the hydration phase anymore - therefore reset it here
167159
set_hydrating(false);
168-
finished_hydrating = true;
160+
hydrated = true;
169161
return instance;
170162
}, false);
171163
} catch (error) {
172-
if (!finished_hydrating && options.recover !== false && nodes !== null) {
164+
if (!hydrated && options.recover !== false && nodes !== null) {
173165
// eslint-disable-next-line no-console
174166
console.error(
175167
'ERR_SVELTE_HYDRATION_MISMATCH' +

0 commit comments

Comments
 (0)