Skip to content

Commit 914529f

Browse files
feat: smaller destructor chunk (#8763)
technically a breaking change because someone with a mutation observer could rely on the order of operations --------- Co-authored-by: Simon H <[email protected]>
1 parent 88504ee commit 914529f

File tree

83 files changed

+523
-243
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

83 files changed

+523
-243
lines changed

.changeset/eighty-tigers-rhyme.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte': patch
3+
---
4+
5+
feat: smaller minified output for destructor chunks

documentation/docs/05-misc/04-v4-migration-guide.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -154,3 +154,4 @@ The order in which preprocessors are applied has changed. Now, preprocessors are
154154
- people implementing their own stores from scratch using the `StartStopNotifier` interface (which is passed to the create function of `writable` etc) from `svelte/store` now need to pass an update function in addition to the set function. This has no effect on people using stores or creating stores using the existing Svelte stores. ([#6750](https://github.com/sveltejs/svelte/issues/6750))
155155
- `derived` will now throw an error on falsy values instead of stores passed to it. ([#7947](https://github.com/sveltejs/svelte/issues/7947))
156156
- type definitions for `svelte/internal` were removed to further discourage usage of those internal methods which are not public API. Most of these will likely change for Svelte 5
157+
- Removal of DOM nodes is now batched which slightly changes its order, which might affect the order of events fired if you're using a MutationObserver on these elements ([#8763](https://github.com/sveltejs/svelte/pull/8763))

packages/svelte/src/compiler/compile/render_dom/Block.js

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { b, x } from 'code-red';
22
import { is_head } from './wrappers/shared/is_head.js';
33
import { regex_double_quotes } from '../../utils/patterns.js';
4+
import { flatten } from '../../utils/flatten.js';
45

56
export default class Block {
67
/**
@@ -380,8 +381,27 @@ export default class Block {
380381
if (this.chunks.destroy.length === 0) {
381382
properties.destroy = noop;
382383
} else {
384+
const dispose_elements = [];
385+
// Coalesce if blocks with the same condition
386+
const others = flatten(this.chunks.destroy).filter(
387+
/** @param {import('estree').Node} node */
388+
(node) => {
389+
if (
390+
node.type === 'IfStatement' &&
391+
node.test.type === 'Identifier' &&
392+
node.test.name === 'detaching'
393+
) {
394+
dispose_elements.push(node.consequent);
395+
return false;
396+
} else {
397+
return true;
398+
}
399+
}
400+
);
401+
383402
properties.destroy = x`function #destroy(detaching) {
384-
${this.chunks.destroy}
403+
${dispose_elements.length ? b`if (detaching) { ${dispose_elements} }` : null}
404+
${others}
385405
}`;
386406
}
387407
if (!this.renderer.component.compile_options.dev) {

packages/svelte/test/js/samples/action-custom-event-handler/expected.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,10 @@ function create_fragment(ctx) {
3636
i: noop,
3737
o: noop,
3838
d(detaching) {
39-
if (detaching) detach(button);
39+
if (detaching) {
40+
detach(button);
41+
}
42+
4043
mounted = false;
4144
dispose();
4245
}

packages/svelte/test/js/samples/action/expected.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,10 @@ function create_fragment(ctx) {
3535
i: noop,
3636
o: noop,
3737
d(detaching) {
38-
if (detaching) detach(a);
38+
if (detaching) {
39+
detach(a);
40+
}
41+
3942
mounted = false;
4043
dispose();
4144
}

packages/svelte/test/js/samples/bind-open/expected.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,10 @@ function create_fragment(ctx) {
3737
i: noop,
3838
o: noop,
3939
d(detaching) {
40-
if (detaching) detach(details);
40+
if (detaching) {
41+
detach(details);
42+
}
43+
4144
mounted = false;
4245
dispose();
4346
}

packages/svelte/test/js/samples/bind-width-height/expected.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,10 @@ function create_fragment(ctx) {
2929
i: noop,
3030
o: noop,
3131
d(detaching) {
32-
if (detaching) detach(div);
32+
if (detaching) {
33+
detach(div);
34+
}
35+
3336
div_resize_listener();
3437
}
3538
};

packages/svelte/test/js/samples/bindings-readonly-order/expected.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -46,9 +46,12 @@ function create_fragment(ctx) {
4646
i: noop,
4747
o: noop,
4848
d(detaching) {
49-
if (detaching) detach(input0);
50-
if (detaching) detach(t);
51-
if (detaching) detach(input1);
49+
if (detaching) {
50+
detach(input0);
51+
detach(t);
52+
detach(input1);
53+
}
54+
5255
mounted = false;
5356
run_all(dispose);
5457
}

packages/svelte/test/js/samples/capture-inject-dev-only/expected.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,12 @@ function create_fragment(ctx) {
5252
i: noop,
5353
o: noop,
5454
d(detaching) {
55-
if (detaching) detach(p);
56-
if (detaching) detach(t1);
57-
if (detaching) detach(input);
55+
if (detaching) {
56+
detach(p);
57+
detach(t1);
58+
detach(input);
59+
}
60+
5861
mounted = false;
5962
dispose();
6063
}

packages/svelte/test/js/samples/capture-inject-state/expected.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,9 @@ function create_fragment(ctx) {
7575
i: noop,
7676
o: noop,
7777
d: function destroy(detaching) {
78-
if (detaching) detach_dev(p);
78+
if (detaching) {
79+
detach_dev(p);
80+
}
7981
}
8082
};
8183

@@ -197,4 +199,4 @@ class Component extends SvelteComponentDev {
197199
}
198200

199201
export default Component;
200-
export { moduleLiveBinding, moduleConstantProps };
202+
export { moduleLiveBinding, moduleConstantProps };

packages/svelte/test/js/samples/collapse-element-class-name/expected.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -81,8 +81,11 @@ function create_fragment(ctx) {
8181
current = false;
8282
},
8383
d(detaching) {
84-
if (detaching) detach(div);
85-
if (detaching) detach(t);
84+
if (detaching) {
85+
detach(div);
86+
detach(t);
87+
}
88+
8689
destroy_component(component, detaching);
8790
}
8891
};

packages/svelte/test/js/samples/collapses-text-around-comments/expected.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,9 @@ function create_fragment(ctx) {
3838
i: noop,
3939
o: noop,
4040
d(detaching) {
41-
if (detaching) detach(p);
41+
if (detaching) {
42+
detach(p);
43+
}
4244
}
4345
};
4446
}
@@ -60,4 +62,4 @@ class Component extends SvelteComponent {
6062
}
6163
}
6264

63-
export default Component;
65+
export default Component;

packages/svelte/test/js/samples/component-static-var/expected.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -74,11 +74,14 @@ function create_fragment(ctx) {
7474
current = false;
7575
},
7676
d(detaching) {
77+
if (detaching) {
78+
detach(t0);
79+
detach(t1);
80+
detach(input);
81+
}
82+
7783
destroy_component(foo, detaching);
78-
if (detaching) detach(t0);
7984
destroy_component(bar, detaching);
80-
if (detaching) detach(t1);
81-
if (detaching) detach(input);
8285
mounted = false;
8386
dispose();
8487
}

packages/svelte/test/js/samples/component-store-access-invalidate/expected.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,9 @@ function create_fragment(ctx) {
3434
i: noop,
3535
o: noop,
3636
d(detaching) {
37-
if (detaching) detach(h1);
37+
if (detaching) {
38+
detach(h1);
39+
}
3840
}
3941
};
4042
}

packages/svelte/test/js/samples/component-store-reassign-invalidate/expected.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -50,9 +50,12 @@ function create_fragment(ctx) {
5050
i: noop,
5151
o: noop,
5252
d(detaching) {
53-
if (detaching) detach(h1);
54-
if (detaching) detach(t1);
55-
if (detaching) detach(button);
53+
if (detaching) {
54+
detach(h1);
55+
detach(t1);
56+
detach(button);
57+
}
58+
5659
mounted = false;
5760
dispose();
5861
}

packages/svelte/test/js/samples/css-media-query/expected.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,9 @@ function create_fragment(ctx) {
3030
i: noop,
3131
o: noop,
3232
d(detaching) {
33-
if (detaching) detach(div);
33+
if (detaching) {
34+
detach(div);
35+
}
3436
}
3537
};
3638
}
@@ -42,4 +44,4 @@ class Component extends SvelteComponent {
4244
}
4345
}
4446

45-
export default Component;
47+
export default Component;

packages/svelte/test/js/samples/css-shadow-dom-keyframes/expected.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,9 @@ function create_fragment(ctx) {
3232
i: noop,
3333
o: noop,
3434
d(detaching) {
35-
if (detaching) detach(div);
35+
if (detaching) {
36+
detach(div);
37+
}
3638
}
3739
};
3840
}

packages/svelte/test/js/samples/custom-svelte-path/expected.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,9 @@ function create_fragment(ctx) {
3939
i: noop,
4040
o: noop,
4141
d(detaching) {
42-
if (detaching) detach(h1);
42+
if (detaching) {
43+
detach(h1);
44+
}
4345
}
4446
};
4547
}

packages/svelte/test/js/samples/data-attribute/expected.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,11 @@ function create_fragment(ctx) {
3737
i: noop,
3838
o: noop,
3939
d(detaching) {
40-
if (detaching) detach(div0);
41-
if (detaching) detach(t);
42-
if (detaching) detach(div1);
40+
if (detaching) {
41+
detach(div0);
42+
detach(t);
43+
detach(div1);
44+
}
4345
}
4446
};
4547
}

packages/svelte/test/js/samples/debug-empty/expected.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,10 @@ function create_fragment(ctx) {
5252
i: noop,
5353
o: noop,
5454
d: function destroy(detaching) {
55-
if (detaching) detach_dev(h1);
56-
if (detaching) detach_dev(t3);
55+
if (detaching) {
56+
detach_dev(h1);
57+
detach_dev(t3);
58+
}
5759
}
5860
};
5961

packages/svelte/test/js/samples/debug-foo-bar-baz-things/expected.js

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -68,8 +68,10 @@ function create_each_block(ctx) {
6868
}
6969
},
7070
d: function destroy(detaching) {
71-
if (detaching) detach_dev(span);
72-
if (detaching) detach_dev(t1);
71+
if (detaching) {
72+
detach_dev(span);
73+
detach_dev(t1);
74+
}
7375
}
7476
};
7577

@@ -152,9 +154,12 @@ function create_fragment(ctx) {
152154
i: noop,
153155
o: noop,
154156
d: function destroy(detaching) {
157+
if (detaching) {
158+
detach_dev(t0);
159+
detach_dev(p);
160+
}
161+
155162
destroy_each(each_blocks, detaching);
156-
if (detaching) detach_dev(t0);
157-
if (detaching) detach_dev(p);
158163
}
159164
};
160165

packages/svelte/test/js/samples/debug-foo/expected.js

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -62,8 +62,10 @@ function create_each_block(ctx) {
6262
}
6363
},
6464
d: function destroy(detaching) {
65-
if (detaching) detach_dev(span);
66-
if (detaching) detach_dev(t1);
65+
if (detaching) {
66+
detach_dev(span);
67+
detach_dev(t1);
68+
}
6769
}
6870
};
6971

@@ -146,9 +148,12 @@ function create_fragment(ctx) {
146148
i: noop,
147149
o: noop,
148150
d: function destroy(detaching) {
151+
if (detaching) {
152+
detach_dev(t0);
153+
detach_dev(p);
154+
}
155+
149156
destroy_each(each_blocks, detaching);
150-
if (detaching) detach_dev(t0);
151-
if (detaching) detach_dev(p);
152157
}
153158
};
154159

packages/svelte/test/js/samples/debug-no-dependencies/expected.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,8 +47,10 @@ function create_each_block(ctx) {
4747
},
4848
p: noop,
4949
d: function destroy(detaching) {
50-
if (detaching) detach_dev(t0);
51-
if (detaching) detach_dev(t1);
50+
if (detaching) {
51+
detach_dev(t0);
52+
detach_dev(t1);
53+
}
5254
}
5355
};
5456

@@ -119,8 +121,11 @@ function create_fragment(ctx) {
119121
i: noop,
120122
o: noop,
121123
d: function destroy(detaching) {
124+
if (detaching) {
125+
detach_dev(each_1_anchor);
126+
}
127+
122128
destroy_each(each_blocks, detaching);
123-
if (detaching) detach_dev(each_1_anchor);
124129
}
125130
};
126131

packages/svelte/test/js/samples/deconflict-builtins/expected.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,9 @@ function create_each_block(ctx) {
4040
if (dirty & /*createElement*/ 1 && t_value !== (t_value = /*node*/ ctx[1] + "")) set_data(t, t_value);
4141
},
4242
d(detaching) {
43-
if (detaching) detach(span);
43+
if (detaching) {
44+
detach(span);
45+
}
4446
}
4547
};
4648
}
@@ -98,8 +100,11 @@ function create_fragment(ctx) {
98100
i: noop,
99101
o: noop,
100102
d(detaching) {
103+
if (detaching) {
104+
detach(each_1_anchor);
105+
}
106+
101107
destroy_each(each_blocks, detaching);
102-
if (detaching) detach(each_1_anchor);
103108
}
104109
};
105110
}

0 commit comments

Comments
 (0)