feedback and tweaks

Author: trueadm

packages/svelte/scripts/check-treeshakeability.js

@@ -57,6 +57,7 @@ for (const key in pkg.exports) {
 	if (key === './compiler') continue;
 	if (key === './internal') continue;
 	if (key === './internal/disclose-version') continue;
+	if (key === './internal/flags/legacy') continue;
 
 	for (const type of ['browser', 'default']) {
 		if (!pkg.exports[key][type]) continue;
@@ -83,6 +84,7 @@ const bundle = await bundle_code(
 	// Use all features which contain hydration code to ensure it's treeshakeable
 	compile(
 		`
+<svelte:options runes />
 <script>
 	import { mount } from ${JSON.stringify(client_main)}; mount();
 	let foo;
@@ -118,12 +120,23 @@ if (!bundle.includes('hydrate_node') && !bundle.includes('hydrate_next')) {
 	// eslint-disable-next-line no-console
 	console.error(`✅ Hydration code treeshakeable`);
 } else {
-	// eslint-disable-next-line no-console
-	console.error(bundle);
+	failed = true;
 	// eslint-disable-next-line no-console
 	console.error(`❌ Hydration code not treeshakeable`);
+}
+
+if (!bundle.includes('component_context.l')) {
+	// eslint-disable-next-line no-console
+	console.error(`✅ Legacy code treeshakeable`);
+} else {
 	failed = true;
+	// eslint-disable-next-line no-console
+	console.error(`❌ Legacy code not treeshakeable`);
+}
 
+if (failed) {
+	// eslint-disable-next-line no-console
+	// console.error(bundle);
 	fs.writeFileSync('scripts/_bundle.js', bundle);
 }
 

packages/svelte/src/internal/client/dom/blocks/each.js

@@ -36,6 +36,7 @@ import { array_from, is_array } from '../../../shared/utils.js';
 import { INERT } from '../../constants.js';
 import { queue_micro_task } from '../task.js';
 import { active_effect, active_reaction } from '../../runtime.js';
+import { legacy_mode_flag } from '../../../flags/index.js';
 
 /**
  * The row of a keyed each block that is currently updating. We track this
@@ -490,27 +491,27 @@ function update_item(item, value, index, type) {
  */
 function create_item(anchor, state, prev, next, value, key, index, render_fn, flags) {
 	var previous_each_item = current_each_item;
+	var reactive = (flags & EACH_ITEM_REACTIVE) !== 0;
+	var mutable = (flags & EACH_ITEM_IMMUTABLE) === 0;
+
+	var v = reactive ? (legacy_mode_flag && mutable ? mutable_source(value) : source(value)) : value;
+	var i = (flags & EACH_INDEX_REACTIVE) === 0 ? index : source(index);
+
+	/** @type {EachItem} */
+	var item = {
+		i,
+		v,
+		k: key,
+		a: null,
+		// @ts-expect-error
+		e: null,
+		prev,
+		next
+	};
+
+	current_each_item = item;
 
 	try {
-		var reactive = (flags & EACH_ITEM_REACTIVE) !== 0;
-		var mutable = (flags & EACH_ITEM_IMMUTABLE) === 0;
-
-		var v = reactive ? (mutable ? mutable_source(value) : source(value)) : value;
-		var i = (flags & EACH_INDEX_REACTIVE) === 0 ? index : source(index);
-
-		/** @type {EachItem} */
-		var item = {
-			i,
-			v,
-			k: key,
-			a: null,
-			// @ts-expect-error
-			e: null,
-			prev,
-			next
-		};
-
-		current_each_item = item;
 		item.e = branch(() => render_fn(anchor, v, i), hydrating);
 
 		item.e.prev = prev && prev.e;