webentwicklung-frage-antwort-db.com.de

Warum Redux-Observable über Redux-Saga verwenden?

Ich habe Redux-Saga verwendet. Code, der damit geschrieben wurde, ist bisher leicht zu begründen, außer dass die JS-Generatorfunktion von Zeit zu Zeit meinen Kopf durcheinander bringt. Nach meinem Verständnis kann Redux-Observable einen ähnlichen Job erzielen, der mit Nebenwirkungen umgeht, jedoch ohne Generatorfunktion.

Dokumente von Redux-Observable liefern jedoch nicht viele Meinungen darüber, warum es Redux-Saga überlegen ist. Ich würde gerne wissen, ob die Verwendung der Generatorfunktion der einzige Vorteil der Verwendung von Redux-Observable ist. Und was können die Nachteile, Probleme oder Kompromisse bei der Verwendung von Redux-Observable anstelle von Redux-Saga sein? Danke im Voraus.

114
Ivan Wang

Haftungsausschluss: Ich bin einer der Autoren von Redux-Observable, daher fällt es mir schwer, 100% unparteiisch zu sein.

Wir geben derzeit keinen Grund an, warum redux-observable besser ist als redux-saga, weil ... es nicht ist. ????

es gibt Vor- und Nachteile für beide. Viele werden eine intuitiver finden als die andere, aber beide sind auf unterschiedliche Weise komplex zu lernen, wenn Sie RxJS (Redux Observable) oder Generatoren/"Effekte als Daten" (Redux-Saga) nicht kennen.

Sie lösen dasselbe Problem auf äußerst ähnliche Weise, weisen jedoch einige grundlegende Unterschiede auf, die sich erst dann bemerkbar machen, wenn Sie sie ausreichend einsetzen.

redux-observable verschiebt fast alles auf idiomatisches RxJS. Wenn Sie also über RxJS-Kenntnisse verfügen (oder diese erwerben), ist das Erlernen und Verwenden von Redux-Observable super super natürlich. Das bedeutet auch, dass dieses Wissen auf andere Dinge als Redux übertragbar ist. Wenn Sie zu MobX wechseln möchten, wenn Sie zu Angular2 wechseln möchten, wenn Sie zu einem zukünftigen Hotness X wechseln möchten, stehen die Chancen sehr gut, dass RxJS Ihnen helfen kann. Dies liegt daran, dass RxJS eine generische asynchrone Bibliothek ist und in vielerlei Hinsicht einer Programmiersprache an sich gleicht - dem gesamten Paradigma der "reaktiven Programmierung". RxJS existiert seit 2012 und wurde als Port von Rx.NET gestartet (es gibt "Ports" in fast allen wichtigen Sprachen, es ist das Nützliche ).

redux-saga stellt seine zeitbasierten Operatoren selbst zur Verfügung. Während das Wissen, das Sie über Generatoren und den Umgang mit Nebenwirkungen in diesem Prozessmanagerstil erwerben, übertragbar ist, werden die tatsächlichen Operatoren und die Verwendung in keiner anderen wichtigen Bibliothek verwendet. Das ist ein bisschen unglücklich, sollte aber auf keinen Fall für sich genommen einen Deal-Breaker darstellen.

Es werden auch "Effekte als Daten" verwendet ( hier beschrieben ), was anfangs schwierig sein kann, aber bedeutet, dass Ihr Redux-Saga-Code die Nebenwirkungen selbst nicht ausführt . Stattdessen erstellen die von Ihnen verwendeten Hilfsfunktionen Objekte, die Aufgaben ähneln, die die Absicht darstellen, den Nebeneffekt zu bewirken, und die interne Bibliothek führt ihn dann für Sie aus. Dies macht das Testen extrem einfach, ohne dass es einer Verspottung bedarf, und ist für einige Leute sehr attraktiv. Ich persönlich habe jedoch festgestellt, dass dies bedeutet, dass Ihre Komponententests einen Großteil der Logik Ihrer Saga neu implementieren - was diese Tests für IMO nicht sehr nützlich macht (diese Meinung wird nicht von allen geteilt).

Die Leute fragen sich oft, warum wir mit Redux-Observable so etwas nicht machen: Für mich ist es grundsätzlich unvereinbar mit normalem idiomatischem Rx. In Rx verwenden wir Operatoren wie .debounceTime(), die die zum Entprellen erforderliche Logik kapseln. Dies bedeutet jedoch, dass wir eine Version davon erstellen möchten, die das Entprellen nicht tatsächlich ausführt und stattdessen Aufgabenobjekte mit der Absicht ausgibt Sie haben jetzt die Leistungsfähigkeit von Rx verloren, weil Sie Operatoren nicht mehr nur verketten können, weil sie an diesem Task-Objekt arbeiten würden, nicht an dem tatsächlichen Ergebnis der Operation. Das ist wirklich schwer elegant zu erklären. Um die Inkompatibilität von Ansätzen zu verstehen, ist wiederum ein umfassendes Verständnis von Rx erforderlich. Wenn Sie wirklich so etwas wollen, schauen Sie sich redux-cycles an, das cycle.js verwendet und meistens diese Ziele hat. Ich finde, es erfordert zu viel Zeremonie für meinen Geschmack, aber ich ermutige Sie, es auszuprobieren, wenn es Sie interessiert.

Wie ThorbenA bereits erwähnte, scheute ich nicht zuzugeben, dass die Redux-Saga derzeit (13.10.16) der klare Marktführer im Bereich des komplexen Nebenwirkungsmanagements für Redux ist. Es wurde früher gestartet und hat eine robustere Community. Es ist also eine große Attraktion, den De-facto-Standard gegenüber dem neuen Kind auf dem Block anzuwenden. Ich denke, es ist sicher zu sagen, wenn Sie entweder ohne Vorkenntnisse verwenden, sind Sie für einige Verwirrung. Wir verwenden beide ziemlich fortschrittliche Konzepte, die, wenn Sie sie erst einmal "verstanden" haben, das komplexe Nebenwirkungsmanagement weitaus einfacher machen, aber bis dahin stolpern viele.

Der wichtigste Rat, den ich geben kann, ist, keine dieser Bibliotheken einzubringen, bevor Sie sie benötigen. Wenn Sie nur einfache Ajax-Anrufe tätigen, brauchen Sie diese wahrscheinlich nicht. redux-thunk ist einfach zu erlernen und bietet genug für die Grundlagen - aber je komplexer das asynchrone Verhalten, desto schwieriger (oder sogar unmöglich) wird es für redux-thunk. Aber für Redux-Observable/Saga scheint es in vielerlei Hinsicht umso komplexer, je asynchroner es ist. Es ist auch sehr wertvoll, Redux-Thunk mit einem der anderen (Redux-Observable/Saga) im selben Projekt zu verwenden! redux-thunk für deine gewöhnlichen einfachen Sachen und dann nur redux-observable/saga für komplexe Sachen. Das ist eine großartige Möglichkeit, um produktiv zu bleiben. Sie kämpfen also nicht gegen Redux-Observable/Saga für Dinge, die mit Redux-Thunk trivial wären.

205
jayphelps

Ich denke, es gibt Dinge, die Sie berücksichtigen müssen.

  1. Komplexität
  2. Codierungsstil
  3. Lernkurve
  4. Testbarkeit

Nehmen wir an, wir möchten Benutzer von der API abrufen

// Redux-Saga

import axios from 'axios' 

function* watchSaga(){
  yield takeEvery('fetch_user', fetchUser) // waiting for action (fetch_user)
}

function* fetchUser(action){
    try {
        yield put({type:'fetch_user_ing'})
        const response = yield call(axios.get,'/api/users/1')
        yield put({type:'fetch_user_done',user:response.data})
  } catch (error) {
        yield put({type:'fetch_user_error',error})
  }
}

// Redux-Observable
import axios from 'axios'

const fetchUserEpic = action$ => 
    action$
        .ofType('fetch_user')
        .flatMap(()=>
          Observable.from(axios.get('/api/users/1')) // or use Observable.ajax
            .map(response=>({type:'fetch_user_done', user:response.data}))
            .catch(error => Observable.of({type:'fetch_user_error',error}))
            .startWith({type:'fetch_user_ing'})
        )

Außerdem habe ich diesen Artikel geschrieben, um die Unterschiede zwischen Redux-Saga und Redux-Observable in der Tiefe zu vergleichen. Schauen Sie sich diesen Link hier oder Präsentation an.

51
Wayne Chiu

Ich benutze Redux-Observable gegenüber Redux-Saga, weil ich lieber mit Observables als mit Generatoren arbeite. Ich verwende es mit RXJS, einer leistungsstarken Bibliothek für die Arbeit mit Datenströmen. Stellen Sie es sich wie eine asynchrone Loge vor. Schauen Sie sich diese Antwort von Jay Phelps in Bezug auf Nachteile, Probleme und Kompromisse bei der Auswahl an:

redux-saga als projekt gibt es schon länger als redux-observable, das ist sicher ein großes verkaufsargument. Sie finden mehr Dokumentation, Beispiele und wahrscheinlich eine bessere Community, von der Sie Unterstützung erhalten können.

Der Zähler ist, dass die Operatoren und APIs, die Sie in Redux-Saga lernen, bei weitem nicht so übertragbar sind wie das Lernen von RxJS, das überall verwendet wird. redux-observable ist intern super super super einfach, es gibt Ihnen nur eine natürliche Möglichkeit, RxJS zu verwenden. Wenn Sie also RxJS kennen (oder wollen), ist dies eine sehr natürliche Passform.

Mein Ratschlag für die meisten Leute ist, wenn Sie fragen müssen, welche Sie verwenden sollen, sollten Sie sich wahrscheinlich für Redux-Saga entscheiden.

18
ThorbenA

Ich schätze die Übertragbarkeit zwischen Sprachen und Laufzeiten, die Rx hat. Auch wenn Ihre App die Sprache nicht ändert, kann Ihre Karriere. Holen Sie sich den bestmöglichen Hebel für Ihr Lernen, wie auch immer Sie es für sich selbst einschätzen. Es ist ein großartiges Tor zu .Net LINQ im Besonderen.

6
Dean Radcliffe

Redux-Observable ist eine erstaunliche Bibliothek, die wir 1,5 Jahre lang ohne Probleme in der Produktion verwenden. Sie ist perfekt testbar und kann problemlos in jedes Framework integriert werden. Wir haben extrem überlastete parallele Socket-Kanäle und das einzige, was uns vor dem Einfrieren bewahrt, ist Redux-Observable

Ich habe 3 Punkte, die ich hier erwähnen möchte.

1. Komplexität und Lernkurve

Die Redux-Saga schlägt hier die Redux-Saga. Wenn Sie nur eine einfache Anforderung benötigen, um die Autorisierung durchzuführen, und Sie aus bestimmten Gründen kein Redux-Thunk verwenden möchten, sollten Sie die Verwendung von Redux-Saga in Betracht ziehen. Dies ist nur einfacher zu verstehen.

Wenn Sie keine Vorkenntnisse in Observable haben, wird es Ihnen weh tun und Ihr Team wird Sie verinnerlichen :)

2. Was können Observable und RxJS mir bieten?

Wenn es um asynchrone Logik geht, ist Observable Ihr Schweizer Messer. Observable kann buchstäblich fast alles für Sie tun. Sie sollten sie niemals mit Versprechungen oder Generatoren vergleichen. Es ist weitaus leistungsstärker als der Vergleich von Optimus Prime mit Chevrolet.

Und was ist mit RxJS? Es ist wie lodash.js, aber für asynchrone Logik, wenn Sie erst einmal drin sind, werden Sie niemals zu etwas anderem wechseln.

3. Reaktive Erweiterung

Überprüfen Sie einfach diesen Link

http://reactivex.io/languages.html

Die reaktive Erweiterung ist für alle modernen Programmiersprachen implementiert und nur Ihr Schlüssel zur funktionalen Programmierung.

Lerne also RxJS mit Bedacht und benutze redux-observable :)

5
Denis Rybalka

Da es hier eine ganze Menge Redux-beobachtbarer Vorträge gibt, hätte ich gedacht, ich würde die Saga-Seite des Arguments angeben. Ich verwende weder Redux-Observable noch RxJS, daher kann ich keinen Nebeneinander-Vergleich anstellen, aber ich habe Sagen mit großer Wirkung eingesetzt.

Für was es sich lohnt, verwende ich Sagen in der Produktion in einer Webanwendung.

Sagas vs. Thunk

Saga gewinnt zweifellos. Mir hat nicht gefallen, wie Thunk die Logik in meine Action-Schöpfer gesteckt hat. Es machte auch einige Anfragen in Folge mühsam. Ich schaute kurz auf Redux-Observable für diesen Job, entschied mich aber für Sagas.

Lernkurve für Sagen

Zu verstehen, was Generatoren sind und warum sie wichtig sind, ist der Schlüssel zum Verständnis von Sagen. Aber ich werde betonen, dass Sie nicht Generatoren von innen und außen kennen müssen. Sie müssen nur wissen, dass Sie mit der Yield-Anweisung die Kontrolle abgeben und dass die Saga die Kontrolle zurückgibt, nachdem der asynchrone Code aufgelöst wurde. Danach ist es nicht sehr schwer zu verstehen, was in einer Saga vor sich geht.

Die Kernsagamethoden sind (meiner Erfahrung nach):

  • call - Rufe ein beliebiges Bit des Codes auf und erhalte den Rückgabewert. Unterstützt Versprechen. Hervorragende Synergie zwischen asynchroner Verarbeitung und Saga.
  • select - Selektor anrufen. Dieses Stück ist ziemlich genial. Selektoren sind der Kern von Redux und werden zu 100% unterstützt!
  • put - aka dispatch eine Aktion. In der Tat versenden Sie so viele, wie Sie wollen!

Es gibt noch andere Funktionen, aber wenn Sie diese drei beherrschen, sind Sie an einem wirklich guten Ort.

Fazit

Der Grund, warum ich mich für Sagen entschieden habe, war die einfache Bedienung. Redux-Observable sah nach einer Herausforderung aus. Ich bin zu 100% mit den Sagen zufrieden. Glücklicher als ich jemals erwartet hatte.

Nach meiner Erfahrung sind Sagas (viel) besser als Thunks und relativ leicht zu verstehen. Rx ist nicht jedermanns Sache. Ich würde Sagas als Redux-beobachtbar betrachten, wenn Sie nicht aus diesem Ökosystem stammen und/oder nicht vorhaben, Rx in Zukunft zu verwenden.

1
Julius Ecker