为什么 Svelte 不单独记录信号？

我想知道 Svelte 的内部结构，以便正确设计我的应用程序以实现最高效率（我可能会处理（数万？）成千上万个要更新的元素，因此效率很重要），尤其是如何实现反应性。因此，使用这个小示例（在链接上，您可以在右侧选项卡上检查 JS 代码），我实现了这个基本代码：

<script>
    let foo = $state(42);
    let bar = $state(52);
</script>

<div onclick={() => foo = foo + 2}>
    Hello {foo}
</div>
<span onclick={() => bar = bar + 1}>
    Hello {bar}
</span>

我得到了以下编译后的 JavaScript：

import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';

var on_click = (_, foo) => $.set(foo, $.get(foo) + 2);
var on_click_1 = (__1, bar) => $.set(bar, $.get(bar) + 1);
var root = $.template(`<div> </div> <span> </span>`, 1);

export default function App($$anchor) {
    let foo = $.state(42);
    let bar = $.state(52);
    var fragment = root();
    var div = $.first_child(fragment);

    div.__click = [on_click, foo];

    var text = $.child(div);

    $.reset(div);

    var span = $.sibling(div, 2);

    span.__click = [on_click_1, bar];

    var text_1 = $.child(span);

    $.reset(span);

    $.template_effect(() => {
        $.set_text(text, `Hello ${$.get(foo) ?? ''}`);
        $.set_text(text_1, `Hello ${$.get(bar) ?? ''}`);
    });

    $.append($$anchor, fragment);
}

$.delegate(['click']);

看起来重要的是代码：

    $.template_effect(() => {
        $.set_text(text, `Hello ${$.get(foo) ?? ''}`);
        $.set_text(text_1, `Hello ${$.get(bar) ?? ''}`);
    });

如果我对信号的理解是正确的（我遵循了这篇很棒的文章来了解信号是如何实现的），那么每次内部信号发生变化时，都会运行回调函数……但问题是，如果bar发生变化，代码$.set_text(text, `Hello ${$.get(foo) ?? ''}`);也会发生变化，即改变一个信号会触发 O（n）操作，其中 n 是信号的数量……对于 2 个元素来说这并不多，但如果我有数万个元素，恐怕更新时间就不可忽略了。

我有两个问题：

1. 为什么 Svelte 不为每个信号实现一个​​回调，以实现与信号数量无关的 O（1）复杂度？
2. 另外，可观察对象是否遵循相同的想法？我的最终目标是了解 Dexie.jsliveQuery可观察对象中更新的复杂性。