Funktion: createQueuer()

function createQueuer<TValue, TSelected>(
   fn, 
   initialOptions, 
selector): SolidQueuer<TValue, TSelected>

function createQueuer<TValue, TSelected>(
   fn, 
   initialOptions, 
selector): SolidQueuer<TValue, TSelected>

Definiert in: queuer/createQueuer.ts:101

Erstellt eine Solid-kompatible Queuer-Instanz zur Verwaltung einer synchronen Item-Warteschlange, die Solid-Signale für alle zustandsbehafteten Eigenschaften bereitstellt.

Merkmale

Synchrone Verarbeitung von Elementen unter Verwendung der bereitgestellten fn Funktion
FIFO (First In First Out) oder LIFO (Last In First Out) Warteschlangenverhalten
Prioritätswarteschlangen über getPriority oder die priority Eigenschaft des Elements
Elementablauf und Entfernung veralteter Elemente
Konfigurierbare Wartezeit zwischen der Verarbeitung von Elementen
Verarbeitung pausieren/fortsetzen
Callbacks für Warteschlangenstatusänderungen, Ausführung, Ablehnung und Ablauf
Alle zustandsbehafteten Eigenschaften (Elemente, Zählungen usw.) werden als Solid-Signale für Reaktivität ausgegeben

Die Warteschlange verarbeitet Elemente synchron der Reihe nach, mit optionalen Verzögerungen zwischen jedem Element. Wenn sie gestartet wird, verarbeitet sie ein Element pro Tick mit einer optionalen Wartezeit zwischen den Ticks. Sie können die Verarbeitung mit stop() und start() pausieren und fortsetzen.

Standardmäßig verwendet die Warteschlange das FIFO-Verhalten, aber Sie können LIFO oder Double-Ended-Queueing konfigurieren, indem Sie die Position beim Hinzufügen oder Entfernen von Elementen angeben.

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

executionCount: Anzahl der verarbeiteten Elemente
isRunning: Ob der Queuer gerade läuft (nicht gestoppt)
items: Array der Elemente, die derzeit zur Verarbeitung in der Warteschlange stehen
rejectionCount: Anzahl der abgelehnten Elemente (abgelaufen oder Validierung fehlgeschlagen)

Beispielanwendung

tsx

// Default behavior - no reactive state subscriptions
const queue = createQueuer(
  (item) => {
    // process item synchronously
    console.log('Processing', item);
  },
  {
    started: true, // Start processing immediately
    wait: 1000,    // Process one item every second
    getPriority: (item) => item.priority // Process higher priority items first
  }
);

// Opt-in to re-render when items or isRunning changes (optimized for UI updates)
const queue = createQueuer(
  (item) => console.log('Processing', item),
  { started: true, wait: 1000 },
  (state) => ({ items: state.items, isRunning: state.isRunning })
);

// Opt-in to re-render when execution metrics change (optimized for tracking progress)
const queue = createQueuer(
  (item) => console.log('Processing', item),
  { started: true, wait: 1000 },
  (state) => ({
    executionCount: state.executionCount,
    rejectionCount: state.rejectionCount
  })
);

// Add items to process - they'll be handled automatically
queue.addItem('task1');
queue.addItem('task2');

// Control the scheduler
queue.stop();  // Pause processing
queue.start(); // Resume processing

// Access the selected state (will be empty object {} unless selector provided)
const { items, isRunning } = queue.state();

// Default behavior - no reactive state subscriptions
const queue = createQueuer(
  (item) => {
    // process item synchronously
    console.log('Processing', item);
  },
  {
    started: true, // Start processing immediately
    wait: 1000,    // Process one item every second
    getPriority: (item) => item.priority // Process higher priority items first
  }
);

// Opt-in to re-render when items or isRunning changes (optimized for UI updates)
const queue = createQueuer(
  (item) => console.log('Processing', item),
  { started: true, wait: 1000 },
  (state) => ({ items: state.items, isRunning: state.isRunning })
);

// Opt-in to re-render when execution metrics change (optimized for tracking progress)
const queue = createQueuer(
  (item) => console.log('Processing', item),
  { started: true, wait: 1000 },
  (state) => ({
    executionCount: state.executionCount,
    rejectionCount: state.rejectionCount
  })
);

// Add items to process - they'll be handled automatically
queue.addItem('task1');
queue.addItem('task2');

// Control the scheduler
queue.stop();  // Pause processing
queue.start(); // Resume processing

// Access the selected state (will be empty object {} unless selector provided)
const { items, isRunning } = queue.state();

createQueuer

Funktion: createQueuer()

Zustandsverwaltung und Selektor

Typparameter

Parameter

fn

initialOptions

selector

Gibt zurück

Bytes abonnieren

Bytes abonnieren