javascript / expert
Snippet
Hochperformante reaktive Internationalisierung
Das Erstellen neuer Intl-Formatierer ist rechenintensiv. Durch die Verwendung von $derived stellen wir sicher, dass der Formatierer nur dann neu instanziiert wird, wenn sich das Gebietsschema oder die Währung ändert. Dieses Muster optimiert die Leistung in großen Anwendungen, in denen Daten dynamisch formatiert werden müssen.
snippet.js
1
2
3
4
5
6
7
8
9
let locale = $state('en-US');let amount = $state(1250.50);let formatter = $derived(new Intl.NumberFormat(locale, {style: 'currency',currency: locale === 'de-DE' ? 'EUR' : 'USD'}));let displayPrice = $derived(formatter.format(amount));
svelte
Erklärung
1
let locale = $state('en-US');
Deklariert den reaktiven Auslöser für das Gebietsschema.
2
let formatter = $derived(...);
Memoisiert die teure Instanziierung des Intl-Objekts.
3
formatter.format(amount)
Verwendet den zwischengespeicherten Formatierer für hochfrequente Updates.