fix: don't rerun async effects unnecessarily

.changeset/wild-mirrors-take.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't rerun async effects unnecessarily

packages/svelte/src/internal/client/reactivity/batch.js

@@ -1,4 +1,4 @@
-/** @import { Derived, Effect, Source, Value } from '#client' */
+/** @import { Derived, Effect, Reaction, Source, Value } from '#client' */
 import {
 BLOCK_EFFECT,
 BRANCH_EFFECT,
@@ -342,31 +342,46 @@ export class Batch {
 continue;
 }
 
+/** @type {Source[]} */
+const sources = [];
+
 for (const [source, value] of this.current) {
 if (batch.current.has(source)) {
-if (is_earlier) {
+if (is_earlier && value !== batch.current.get(source)) {
 // bring the value up to date
 batch.current.set(source, value);
 } else {
-// later batch has more recent value,
+// same value or later batch has more recent value,
 // no need to re-run these effects
 continue;
 }
 }
 
-mark_effects(source);
+sources.push(source);
 }
 
-if (queued_root_effects.length > 0) {
-current_batch = batch;
-batch.apply();
+if (sources.length === 0) {
+continue;
+}
 
-for (const root of queued_root_effects) {
-batch.#traverse_effect_tree(root);
+// Re-run async/block effects that depend on distinct values changed in both batches
+const others = [...batch.current.keys()].filter((s) => !this.current.has(s));
+if (others.length > 0) {
+for (const source of sources) {
+mark_effects(source, others);
 }
 
-queued_root_effects = [];
-batch.deactivate();
+if (queued_root_effects.length > 0) {
+current_batch = batch;
+batch.apply();
+
+for (const root of queued_root_effects) {
+batch.#traverse_effect_tree(root);
+}
+
+queued_root_effects = [];
+batch.deactivate();
+}
 }
 }
 
@@ -621,24 +636,46 @@ function flush_queued_effects(effects) {
 
 /**
  * This is similar to `mark_reactions`, but it only marks async/block effects
- * so that these can re-run after another batch has been committed
+ * depending on `value` and at least one of the other `sources`, so that
+ * these effects can re-run after another batch has been committed
  * @param {Value} value
+ * @param {Source[]} sources
  */
-function mark_effects(value) {
+function mark_effects(value, sources) {
 if (value.reactions !== null) {
 for (const reaction of value.reactions) {
 const flags = reaction.f;
 
 if ((flags & DERIVED) !== 0) {
-mark_effects(/** @type {Derived} */ (reaction));
-} else if ((flags & (ASYNC | BLOCK_EFFECT)) !== 0) {
+mark_effects(/** @type {Derived} */ (reaction), sources);
+} else if ((flags & (ASYNC | BLOCK_EFFECT)) !== 0 && depends_on(reaction, sources)) {
 set_signal_status(reaction, DIRTY);
 schedule_effect(/** @type {Effect} */ (reaction));
 }
 }
 }
 }
 
+/**
+ * @param {Reaction} reaction
+ * @param {Source[]} sources
+ */
+function depends_on(reaction, sources) {
+if (reaction.deps !== null) {
+for (const dep of reaction.deps) {
+if (sources.includes(dep)) {
+return true;
+}
+
+if ((dep.f & DERIVED) !== 0 && depends_on(/** @type {Derived} */ (dep), sources)) {
+return true;
+}
+}
+}
+
+return false;
+}
+
 /**
  * @param {Effect} signal
  * @returns {void}

packages/svelte/src/internal/client/reactivity/deriveds.js

@@ -171,6 +171,13 @@ export function async_derived(fn, location) {
 
 internal_set(signal, value);
 
+// All prior async derived runs are now stale
+for (const [b, d] of deferreds) {
+deferreds.delete(b);
+if (b === batch) break;
+d.reject(STALE_REACTION);
+}
+
 if (DEV && location !== undefined) {
 recent_async_deriveds.add(signal);
 

packages/svelte/tests/runtime-runes/samples/async-resolve-stale/_config.js

@@ -20,7 +20,6 @@ export default test({
 input.value = '12';
 input.dispatchEvent(new Event('input', { bubbles: true }));
 await macrotask(6);
-// TODO this is wrong (separate bug), this should be 3 | 12
-assert.htmlEqual(target.innerHTML, '<input> 5 | 12');
+assert.htmlEqual(target.innerHTML, '<input> 3 | 12');
 }
 });