Framework
Version
Debouncer API Referenz
Throttler API Referenz
Rate Limiter API Referenz
Queue API Referenz
Batcher API Referenz

createAsyncQueuer

Funktion: createAsyncQueuer()

ts
function createAsyncQueuer<TValue, TSelected>(
   fn, 
   initialOptions, 
selector): SolidAsyncQueuer<TValue, TSelected>
function createAsyncQueuer<TValue, TSelected>(
   fn, 
   initialOptions, 
selector): SolidAsyncQueuer<TValue, TSelected>

Definiert in: async-queuer/createAsyncQueuer.ts:120

Erstellt eine Solid-kompatible AsyncQueuer-Instanz zur Verwaltung einer asynchronen Warteschlange von Elementen, die Solid-Signale für alle zustandsbehafteten Eigenschaften bereitstellt.

Merkmale

  • Prioritätswarteschlangen über getPriority oder Element priority-Eigenschaft
  • Konfigurierbare Nebenläufigkeitsgrenze
  • FIFO (First In First Out) oder LIFO (Last In First Out) Warteschlangenverhalten
  • Verarbeitung pausieren/fortsetzen
  • Aufgabenabbruch
  • Elementablauf
  • Lifecycle-Rückrufe für Erfolg, Fehler, Abwicklung, Elementänderungen usw.
  • Alle zustandsbehafteten Eigenschaften (aktive Elemente, ausstehende Elemente, Zähler usw.) werden als Solid-Signale für Reaktivität bereitgestellt

Aufgaben werden parallel bis zum konfigurierten Parallelitätslimit verarbeitet. Wenn eine Aufgabe abgeschlossen ist, wird die nächste ausstehende Aufgabe verarbeitet, wenn das Parallelitätslimit dies zulässt.

Fehlerbehandlung

  • Wenn ein onError Handler bereitgestellt wird, wird dieser mit dem Fehler und der Queuer-Instanz aufgerufen
  • Wenn throwOnError auf true gesetzt ist (Standardwert, wenn kein onError-Handler bereitgestellt wird), wird der Fehler ausgelöst.
  • Wenn throwOnError auf false gesetzt ist (Standardwert, wenn ein onError-Handler bereitgestellt wird), wird der Fehler "verschluckt".
  • Sowohl onError als auch throwOnError können zusammen verwendet werden; der Handler wird aufgerufen, bevor ein Fehler ausgelöst wird
  • Der Fehlerzustand kann mit der zugrunde liegenden AsyncQueuer-Instanz überprüft werden.

Zustandsverwaltung und Selektor

Der Hook verwendet TanStack Store für reaktives Zustandsmanagement. Der Parameter selector ermöglicht es Ihnen anzugeben, welche Zustandsänderungen ein erneutes Rendern auslösen, wodurch die Leistung optimiert wird, indem unnötige erneute Renderings verhindert werden, wenn irrelevante Zustandsänderungen auftreten.

Standardmäßig erfolgen keine reaktiven Zustands-Subscriptions und Sie müssen das Zustands-Tracking durch Bereitstellen einer Selector-Funktion aktivieren. Dies verhindert unnötige Renderings und gibt Ihnen die volle Kontrolle darüber, wann Ihre Komponente aktualisiert wird. Nur wenn Sie einen Selector bereitstellen, wird die Komponente neu gerendert, wenn sich die ausgewählten Zustandswerte ändern.

Verfügbare Zustandseigenschaften

  • activeItems: Array von Elementen, die gerade verarbeitet werden
  • errorCount: Anzahl der Elemente, deren Verarbeitung fehlgeschlagen ist
  • isRunning: Ob der Queuer gerade läuft (nicht gestoppt)
  • pendingItems: Array von Elementen, die auf die Verarbeitung warten
  • rejectionCount: Anzahl der abgelehnten Elemente (abgelaufen oder Validierung fehlgeschlagen)
  • settleCount: Anzahl der Elemente, deren Verarbeitung abgeschlossen ist (erfolgreich oder fehlgeschlagen)
  • successCount: Anzahl der erfolgreich verarbeiteten Elemente

Beispielanwendung

tsx
// Default behavior - no reactive state subscriptions
const asyncQueuer = createAsyncQueuer(async (item) => {
  // process item
  return await fetchData(item);
}, {
  initialItems: [],
  concurrency: 2,
  maxSize: 100,
  started: false,
  onSuccess: (result) => {
    console.log('Item processed:', result);
  },
  onError: (error) => {
    console.error('Processing failed:', error);
  }
});

// Opt-in to re-render when queue state changes (optimized for UI updates)
const asyncQueuer = createAsyncQueuer(
  async (item) => await fetchData(item),
  { concurrency: 2, started: true },
  (state) => ({
    pendingItems: state.pendingItems,
    activeItems: state.activeItems,
    isRunning: state.isRunning
  })
);

// Opt-in to re-render when processing metrics change (optimized for tracking progress)
const asyncQueuer = createAsyncQueuer(
  async (item) => await fetchData(item),
  { concurrency: 2, started: true },
  (state) => ({
    successCount: state.successCount,
    errorCount: state.errorCount,
    settleCount: state.settleCount
  })
);

// Add items to queue
asyncQueuer.addItem(newItem);

// Start processing
asyncQueuer.start();

// Access the selected state (will be empty object {} unless selector provided)
const { pendingItems, activeItems } = asyncQueuer.state();
// Default behavior - no reactive state subscriptions
const asyncQueuer = createAsyncQueuer(async (item) => {
  // process item
  return await fetchData(item);
}, {
  initialItems: [],
  concurrency: 2,
  maxSize: 100,
  started: false,
  onSuccess: (result) => {
    console.log('Item processed:', result);
  },
  onError: (error) => {
    console.error('Processing failed:', error);
  }
});

// Opt-in to re-render when queue state changes (optimized for UI updates)
const asyncQueuer = createAsyncQueuer(
  async (item) => await fetchData(item),
  { concurrency: 2, started: true },
  (state) => ({
    pendingItems: state.pendingItems,
    activeItems: state.activeItems,
    isRunning: state.isRunning
  })
);

// Opt-in to re-render when processing metrics change (optimized for tracking progress)
const asyncQueuer = createAsyncQueuer(
  async (item) => await fetchData(item),
  { concurrency: 2, started: true },
  (state) => ({
    successCount: state.successCount,
    errorCount: state.errorCount,
    settleCount: state.settleCount
  })
);

// Add items to queue
asyncQueuer.addItem(newItem);

// Start processing
asyncQueuer.start();

// Access the selected state (will be empty object {} unless selector provided)
const { pendingItems, activeItems } = asyncQueuer.state();

Typparameter

TValue

TSelected = {}

Parameter

fn

(value) => Promise<any>

initialOptions

AsyncQueuerOptions<TValue> = {}

selector

(state) => TSelected

Gibt zurück

SolidAsyncQueuer<TValue, TSelected>

Unsere Partner
Code Rabbit
Unkey
Bytes abonnieren

Ihre wöchentliche Dosis JavaScript-Nachrichten. Jeden Montag kostenlos an über 100.000 Entwickler geliefert.

Bytes

Kein Spam. Jederzeit kündbar.

Bytes abonnieren

Ihre wöchentliche Dosis JavaScript-Nachrichten. Jeden Montag kostenlos an über 100.000 Entwickler geliefert.

Bytes

Kein Spam. Jederzeit kündbar.