javascript / expert
Snippet
Feinmaschige Abhängigkeitsisolierung mit $untrack
In Svelte 5 abonnieren Effekte automatisch jede Rune, auf die innerhalb ihres Scopes zugegriffen wird. Um zu verhindern, dass ein Effekt erneut ausgeführt wird, wenn sich ein bestimmter Zustand ändert – man diesen Wert aber dennoch für die Ausführung benötigt – verwenden wir die $untrack-Rune. Dies ist entscheidend, um unnötige Ausführungen in performancekritischen Rendering-Pfaden zu vermeiden oder um Zustände zu koordinieren, die keine zirkuläre Abhängigkeit erzeugen sollen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
$effect(() => {console.log('Triggered by:', activeUser.id);$untrack(() => {// Reading theme doesn't subscribe the effect to theme changesapplyStyles(activeUser.id, theme.current);analytics.logEvent('user_view', { theme: theme.current });});});
svelte
Erklärung
1
$effect(() => {
Deklariert einen Seiteneffekt, der reaktive Abhängigkeiten verfolgt.
2
$untrack(() => {
Umschließt einen Codeblock, um zu verhindern, dass der umgebende Effekt die darin enthaltenen Runen abonniert.
3
theme.current
Der Wert wird hier gelesen, aber da er sich innerhalb von $untrack befindet, lösen Änderungen an 'theme.current' den Effekt nicht erneut aus.