Redux sind wie State Container in SwiftUI. Empfehlungen

Letzte Woche haben wir über Redux-artige Staatscontainer in SwiftUI gesprochen . Redux bietet eine einzige Quelle für Wahrheitswerte, die eine Vielzahl potenzieller Fehler verhindert, die in verschiedenen Anwendungszuständen auftreten können. Diese Woche werden wir über bewährte Methoden zum Erstellen von Redux-basierten Anwendungen sprechen, die unsere Codebasis einfach und fehlerfrei halten.

Normalisierung

Im Konzept von Redux gibt es ein Speicherobjekt, das den Status der gesamten Anwendung enthält und das als einzige Quelle für Wahrheitswerte für unsere Anwendung dient. Auf diese Weise können wir die Benutzeroberfläche mit dem Status der Anwendung synchronisieren. Um dies zu erreichen, muss zunächst der Zustand normalisiert werden. Betrachten Sie das folgende Codebeispiel.

struct AppState { var allTasks: [Task] var favorited: [Task] } 

Es gibt eine AppState- Struktur, in der eine Liste einfacher und ausgewählter Aufgaben gespeichert ist . Es sieht einfach aus, hat aber einen großen Fehler. Angenommen, es gibt einen Aufgabenbearbeitungsbildschirm, in dem Sie die ausgewählte Aufgabe ändern können. Immer wenn der Benutzer auf die Schaltfläche Speichern klickt, müssen wir eine bestimmte Aufgabe in der Liste aller Aufgaben (alle Aufgaben) und in der Liste der bevorzugten (ausgewählten) Aufgaben suchen und aktualisieren. Dies kann zu Fehlern und Leistungsproblemen führen, wenn die Liste der Aufgaben zu umfangreich ist.

Lassen Sie uns die Leistung der Anwendung ein wenig verbessern, indem wir die Statusstruktur normalisieren. Zunächst müssen wir unsere Aufgaben im Dictionary speichern, wobei die Aufgabenkennung der Schlüssel und die Aufgabe selbst der Wert ist. Ein Wörterbuch kann einen Schlüsselwert für eine konstante Zeit (O (1)) erhalten , behält aber gleichzeitig die Reihenfolge nicht bei. In diesem Fall können Sie ein Array mit Bezeichnern erstellen, um die Reihenfolge beizubehalten. Betrachten wir nun den geänderten Zustand nach der Normalisierung.

 struct AppState { var tasks: [Int: Task] var allTasks: [Int] var favorited: [Int] } 

Wie im obigen Beispiel angegeben, werden Aufgaben im Wörterbuch gespeichert, wobei die Aufgaben- ID der Schlüssel und die Aufgabe selbst der Wert ist. Felder mit Bezeichnern werden für alle Aufgaben und ausgewählten Aufgaben gespeichert. Wir erreichen einen Stabilitätszustand, der die Benutzeroberfläche und die Daten synchronisiert.

Zusammensetzungszustand

Es ist sehr natürlich, den Status Ihrer Anwendung in einer einzigen Struktur zu speichern, aber es kann einfach explodieren, sobald Sie der Statusstruktur mehr und mehr Felder hinzufügen. Wir können den Kompositionszustand verwenden, um dieses Problem zu lösen. Schauen wir uns ein Beispiel an.

 struct AppState { var calendar: CalendarState var trends: TrendsState var settings: SettingState } 

Im obigen Codebeispiel unterteilen wir unseren Status in drei separate Teile und kombinieren sie zu einem AppState.

Kompositionsreduzierer

Eine weitere wichtige Komponente eines Redux-artigen Zustandscontainers ist Reducer . Es kann wie bei der staatlichen Struktur extrahiert und kombiniert werden. Auf diese Weise können wir den Grundsatz der Einzelverantwortung einhalten und Objekte wie Reduzierstücke mit kleinen Abmessungen warten.

 enum AppAction { case calendar(action: CalendarAction) case trends(action: TrendsAction) } let trendsReducer: Reducer<TrendsState, TrendsAction> = Reducer { state, action in // Implement your state changes here } let calendarReducer: Reducer<CalendarState, CalendarAction> = Reducer { state, action in // Implement your state changes here } let appReducer: Reducer<AppState, AppAction> = Reducer { state, action in switch action { case let .calendar(action): calendarReducer.reduce(&state.calendar, action) case let .trends(action): trendsReducer.reduce(&state.trends, action) } } 

Fazit

Heute haben wir über zwei wichtige Strategien gesprochen, die wir bei der Entwicklung von Anwendungen mit Redux-ähnlichen Statuscontainern in SwiftUI verwenden sollten. Sowohl die Normalisierung als auch die Integration machen die erstellte Anwendung einfacher und verständlicher. Ich hoffe dir gefällt dieser Artikel.

Vielen Dank fürs Lesen und bis nächste Woche!