Die Verwaltung des globalen Status in JavaScript-Anwendungen kann eine Herausforderung sein, insbesondere wenn Sie darauf zugreifen müssen, sowohl in React- als auch in Nicht-React-Kontexten. Vorhandene Bibliotheken erfordern häufig einen hohen Einrichtungsaufwand, unnötige Komplexität und sind eng mit React verknüpft. Aber was wäre, wenn Sie mit der Eleganz und Einfachheit des Papierfaltens zurechtkommen könnten? Geben Sie Origami-State-Manager (OSM) ein.

Was ist OSM?

Origami-State-Manager (OSM), ausgesprochen „awesome“, ist eine schlanke Zustandsverwaltungsbibliothek, die einfach, flexibel und skalierbar ist. Inspiriert von der japanischen Origami-Kunst, die ein einfaches Blatt Papier in komplizierte Designs verwandelt, ermöglicht OSM Ihnen, den globalen Status Ihrer Anwendung mit der gleichen Eleganz zu verwalten. Genau wie Papier ist es unglaublich leicht und eignet sich daher perfekt für Anwendungen, bei denen es auf Einfachheit und Leistung ankommt.

Warum OSM?

Der Weg zum Aufbau von OSM begann mit der Suche nach einer Lösung, die:

• Boilerplate minimieren: Die Statusverwaltung sollte unkompliziert sein und so wenig Einrichtung wie möglich erfordern.
• Seien Sie vielseitig: Arbeiten Sie nahtlos sowohl in React- als auch in Nicht-React-Kontexten.
• Bleiben Sie leichtgewichtig: Vermeiden Sie es, Ihr Paket mit unnötigem Code aufzublähen.
• Flexibel und skalierbar bleiben: Passen Sie sich mühelos an unterschiedliche Projektanforderungen an und behalten Sie gleichzeitig die Leistung bei.

Wenn Sie genug von überentwickelten Lösungen haben und etwas wollen, das einfach funktioniert, könnte OSM das „tolle“ Tool sein, das Sie brauchen.

Hauptfunktionen

• Minimaler Setup: Definieren und verwalten Sie schnell Ihren globalen Status mit einer übersichtlichen, intuitiven API.
• React- und Non-React-Kompatibilität: Auf Zustände kann sowohl über React-Komponenten als auch über einfache JavaScript-Funktionen zugegriffen und diese aktualisiert werden.
• Leichtgewicht: OSM ist so leicht wie Papier und sorgt dafür, dass Ihre App schnell und reaktionsfähig ist.
• Persistenzoptionen: Machen Sie Ihre Zustände mit einer einfachen Konfiguration dauerhaft.

Erste Schritte mit OSM

Sind Sie bereit, Ihrer App etwas OSM-Charakter zu verleihen? So fangen Sie an:

1. Installieren Sie die Bibliothek:

npm install origami-state-manager

2. Erstellen Sie einen Shop:

In einem Geschäft leben alle Ihre globalen Staaten. Das Einrichten ist so einfach wie die Übergabe Ihrer Anfangszustandswerte an createStore:

// store.ts
import { createStore } from "origami-state-manager";

const initialValues = {
  origami: 0,
  osmness: 0,
};

export const store = createStore(initialValues);

Sie können den Shop auch dauerhaft machen, indem Sie einen Shopnamen angeben:

export const store = createStore(initialValues, "myOSMness");

3. Zugriffs- und Aktualisierungsstatus:

Für React-Komponenten verwenden Sie den useStateListener-Hook, um auf den Status zuzugreifen und ihn zu aktualisieren:

import { store } from "./store";
import { useStateListener } from "origami-state-manager";

function OrigamiComponent() {
  const origami = useStateListener("origami", store);

  return (
     store["origami"].value = new Date().getSeconds()}>
      Origami Count: {origami}
    
  );
}

4. Zugriffsstatus in Nicht-Reaktionsfunktionen:

Sie können auch problemlos mit Status außerhalb von React arbeiten:

// utils.js

function getProfile() {
  let profile = store["profile"].value;
  if (!profile) {
    store["profile"].value = {};
  }

  return store["profile"].value;
}

Anwendungsfälle

OSM ist perfekt für Szenarien, in denen:

• Sie benötigen eine schlanke Lösung für eine einfache globale Statusverwaltung.
• Ihr Projekt umfasst sowohl React- als auch Nicht-React-Logik, die den globalen Status teilen muss.
• Sie möchten die Komplexität größerer Bibliotheken wie Redux oder MobX vermeiden.

Achtung: Ein paar Upsies voraus!

OSM befindet sich noch in einem frühen Stadium und wurde noch nicht in allen Umgebungen vollständig getestet. Während es sich ideal für kleinere Projekte und einfache staatliche Anforderungen eignet, ist bei der Verwendung in komplexen Szenarien Vorsicht geboten. Wenn Sie auf Probleme stoßen, melden Sie diese bitte, damit die Bibliothek weiter verbessert werden kann.

Beitrag zu OSM

Möchten Sie dabei helfen, OSM noch großartiger zu machen? Beiträge sind willkommen! Schauen Sie sich die Beitragsrichtlinien an, um loszulegen.

Auf dem Laufenden bleiben

Das Änderungsprotokoll wird regelmäßig mit allen neuen Änderungen und Verbesserungen aktualisiert.

Abschließende Gedanken

Origami-State-Manager (OSM) zielt darauf ab, eine einfache, aber leistungsstarke Lösung für die globale Zustandsverwaltung ohne Aufblähung bereitzustellen. Indem OSM den Setup minimal und die Leistung hoch hält, ermöglicht es Ihnen, sich auf die Erstellung von Funktionen zu konzentrieren, anstatt sich mit der Zustandskomplexität herumzuschlagen.

Probieren Sie es aus und erleben Sie ein neues Maß an OSM-Qualität in Ihren Projekten!

Beginnen Sie noch heute mit OSM: npm: origami-state-manager