Heim > Web-Frontend > js-Tutorial > Verhindert die erneute Ausführung großer Javascript-Funktionen, die einmal mit demselben Parameter verarbeitet wurden.

Verhindert die erneute Ausführung großer Javascript-Funktionen, die einmal mit demselben Parameter verarbeitet wurden.

WBOY
Freigeben: 2024-08-28 06:08:06
Original
544 Leute haben es durchsucht

Prevents re-execution of large javascript functions that have been processed once with the same parameter.

memofy

Cache-Mechanismus (Memoizer) für Funktionen, die mit denselben Parametern ausgeführt werden (nur 1,14 KB)

Dieses Projekt bietet eine Memoize-Funktion zur Verbesserung der Leistung in JavaScript- oder TypeScript-Projekten durch Zwischenspeichern der Ergebnisse teurer Funktionsaufrufe. Durch das Auswendiglernen geben wiederholte Aufrufe mit denselben Argumenten das zwischengespeicherte Ergebnis zurück und beschleunigen so die Ausführung.

Dieses Modul funktioniert wie der useMemo-Hook von React, ist aber NICHT erforderlich. Sie können jedes Framework oder reine Javascript-Projekte verwenden

Npm-Paket
Github

Merkmale

  • Funktionsspeicherung: Zwischenspeichert Ergebnisse von Funktionsaufrufen mit denselben Argumenten.
  • Abhängigkeitsverfolgung: Aktualisiert den Cache, wenn sich Abhängigkeiten ändern.
  • Flexibilität: Verwendbar sowohl in JavaScript- als auch in TypeScript-Projekten.
  • Die beste Lösung für CPU-intensive Vorgänge oder komplexe Berechnungen
  • Die getrennten Funktionen werden aus dem Speicher gelöscht. Die zu dieser Funktion gehörenden Caches werden ebenfalls gelöscht.
  • WeakMap-basierter Cache-Speicher
  • WeakMap Trennt Methoden, die nicht mit schwachen Referenzlinks kommunizieren können, und löst den Garbage Collector aus

Anwendungsfall

Ohne Deps-Parameter

Wenn im folgenden Prozess die concatPhoneNumber-Methode erneut mit denselben Parametern aufgerufen wird, wird die Funktion nicht erneut ausgeführt, sondern ruft das Ergebnis aus dem Cache ab.

import memofy from "memofy";

const concatPhoneNumber = (extension, number) => {
  // Heavy calculation
  // return result
};

const memoizedConcatPhoneNumber = memofy(concatPhoneNumber, []);

memoizedConcatPhoneNumber(90, 555); // Runs concatPhoneNumber when first run
memoizedConcatPhoneNumber(90, 555); // get value from cache

memoizedConcatPhoneNumber(90, 552); // Runs concatPhoneNumber because params is change
Nach dem Login kopieren

Mit deps-Parameter

Wenn Sie möchten, dass die Methode gemäß einigen Abhängigkeiten erneut mit demselben Parameter ausgeführt wird, können Sie den Parameter deps wie folgt übergeben.

import memofy from "memofy";

const taxRatio = 0.5;
const product = { title: "Test product", price: 10 };

const calculateTax = () => {
  // Calculate tax by product price
  // Heavy calculation
  return taxRatio * product.price;
};

const memoizedConcatPhoneNumber = memofy(calculateTax, [product, taxRatio]);

calculatedPrice = calculateTax(); // Runs concatPhoneNumber when first run

product.price = 40;
let calculatedPrice = calculateTax(); // Runs concatPhoneNumber because product dep changed

taxRatio = 0.8;
calculatedPrice = calculateTax(); // Runs concatPhoneNumber because taxRatio changed
Nach dem Login kopieren

Leistungsergebnis

Leistungsergebnisse für eine komplexe Funktion, die Primzahlen unterscheidet. Leistungstest

Case ms
First execute time (no caching) > 52.08 ms
Second execute time (caching) < 0.03 ms
and subsequent execution (caching) < 0.03 ms

Testabdeckungsergebnis

Tests wurden für alle Fälle und alle Parametertypen geschrieben. Tests

File % Stmts % Branch % Funcs % Lines Uncovered Line #s
All files 100 100 100 100 0
lib 100 100 100 100 0
index.ts 100 100 100 100 0
lib/store 100 100 100 100 0
CacheStore.ts 100 100 100 100 0
DepsStore.ts 100 100 100 100 0

Das obige ist der detaillierte Inhalt vonVerhindert die erneute Ausführung großer Javascript-Funktionen, die einmal mit demselben Parameter verarbeitet wurden.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage