React Context vs React Redux, kiedy powinienem używać każdego z nich? [Zamknięte]

React 16.3.0 został wydany, a Context API nie jest już funkcją eksperymentalną. Dan Abramov (twórca Redux) napisał dobry komentarz tutaj o tym, ale to było 2 lata, gdy kontekst był jeszcze funkcja eksperymentalna.

Moje pytanie jest, w opinii / doświadczeń, kiedy należy używać React Kontekst ponad Reaguj Redux i odwrotnie?

Ponieważ kontekst nie jest już funkcją eksperymentalną i możesz używać go bezpośrednio w swojej aplikacji i będzie świetny do przekazywania danych do głęboko zagnieżdżonych komponentów, do których został zaprojektowany.

Jak napisał Mark Erikson na swoim blogu :

Jeśli używasz Reduksa tylko po to, aby uniknąć przekazywania rekwizytów, kontekst może zastąpić Redux - ale wtedy prawdopodobnie nie potrzebowałeś Reduksa w pierwszej kolejności.

Kontekst również nie daje Ci niczego podobnego Redux DevTools, możliwości śledzenia aktualizacji stanu, middlewaredodawania scentralizowanej logiki aplikacji i innych potężnych możliwości, które Redux umożliwiają.

Reduxjest znacznie potężniejszy i zapewnia dużą liczbę funkcji, których Context Apinie zapewnia, również jak wspomniał @danAbramov

React Redux używa kontekstu wewnętrznie, ale nie ujawnia tego faktu w publicznym API. Więc powinieneś czuć się znacznie bezpieczniej, używając kontekstu przez React Redux niż bezpośrednio, ponieważ jeśli to się zmieni, ciężar aktualizacji kodu będzie spoczywał na React Redux, a nie na tobie.

Jego upto Redux, aby faktycznie zaktualizować swoją implementację, aby była zgodna z najnowszym kontekstowym API

Najnowszy kontekstowy interfejs API może być używany w aplikacjach, w których po prostu używałbyś Redux do przekazywania danych między komponentami, jednak aplikacje, które używają scentralizowanych danych i obsługują żądania API w Action, twórcy używający redux-thunklub redux-saganadal potrzebują redukcji. Oprócz tego redux ma powiązane inne biblioteki, takie jak, redux-persistktóre pozwalają na zapisywanie danych przechowywania w localStorage i ponowne nawadnianie przy odświeżaniu, czego wciąż nie obsługuje kontekstowe API.

Jak @dan_abramov wspomniał na swoim blogu, możesz nie potrzebować Redux , ten redux ma użyteczną aplikację, taką jak

• Utrwal stan w lokalnej pamięci, a następnie uruchom z niej, po wyjęciu z pudełka.
• Wypełnij wstępnie stan serwera, wyślij go do klienta w formacie HTML i uruchom z niego po wyjęciu z pudełka.
• Serializuj działania użytkownika i dołączaj je, wraz z migawką stanu, do automatycznych raportów o błędach, aby twórcy produktu
  mogli je odtworzyć w celu odtworzenia błędów.
• Przekaż obiekty akcji przez sieć, aby zaimplementować środowiska współpracy bez radykalnych zmian w sposobie pisania kodu.
• Zachowaj historię cofania lub wdrażaj optymistyczne mutacje bez dramatycznych zmian w sposobie pisania kodu.
• Podróżuj między tworzoną historią stanu i ponownie oceniaj bieżący stan z historii akcji, gdy kod się zmienia, a la TDD.
• Zapewnij pełne możliwości inspekcji i kontroli narzędzi programistycznych, aby deweloperzy produktów mogli tworzyć niestandardowe narzędzia dla swoich
  aplikacji.
• Zapewnij alternatywne interfejsy użytkownika, wykorzystując ponownie większość logiki biznesowej.

Przy tak wielu aplikacjach jest zbyt wcześnie, aby powiedzieć, że Redux zostanie zastąpiony przez nowy Context API

Jeśli używasz Redux tylko po to, aby uniknąć przekazywania właściwości do głęboko zagnieżdżonych komponentów , możesz zamienić Redux na ContextAPI. Jest dokładnie przeznaczony do tego przypadku użycia.

Z drugiej strony, jeśli używasz Redux do wszystkiego innego (mając przewidywalny kontener stanu, obsługując logikę aplikacji poza komponentami, centralizując stan aplikacji, używając Redux DevTools do śledzenia, kiedy, gdzie, dlaczego i jak stan aplikacji zmieniony lub używając wtyczek, takich jak Redux Form , Redux Saga , Redux Undo , Redux Persist , Redux Logger itp.), to nie ma absolutnie żadnego powodu, aby porzucić Redux. ContextAPI nie daje nic z tego.

Osobiście uważam, że rozszerzenie Redux DevTools jest niesamowitym, niedocenianym narzędziem do debugowania, które samo w sobie usprawiedliwia dalsze korzystanie z Redux.

Niektóre odniesienia:

• Redux jeszcze nie umarł!
• Możesz nie potrzebować Redux
• Czy haki React zastępują Redux?

Wolę używać redux z redux-thunk do wykonywania wywołań API (również przy użyciu Axios) i wysyłania odpowiedzi do reduktorów. Jest czysty i łatwy do zrozumienia.

Kontekstowy interfejs API jest bardzo specyficzny dla części reaktywnej, opisującej sposób połączenia komponentów React ze sklepem. W tym celu reaktywacja jest dobra. Ale jeśli chcesz, ponieważ Context jest oficjalnie obsługiwany, możesz użyć Context API zamiast React-Redux.

Tak więc pytanie powinno brzmieć: Kontekstowe API vs React-Redux, a nie Kontekstowe API vs Redux. Również pytanie jest nieco uparte. Ponieważ znam React-Redux i używam go we wszystkich projektach, będę go nadal używać. (Nie ma dla mnie zachęty do zmiany).

Ale jeśli uczysz się Redux dopiero dziś i nigdzie go nie używałeś, warto dać Context API szansę i zastąpić React-Redux swoim niestandardowym kodem Context API. Może w ten sposób jest znacznie czystszy.

Osobiście jest to kwestia zażyłości. Nie ma wyraźnego powodu, aby wybierać jedną z nich, ponieważ są one równoważne. I wewnętrznie, react-redux i tak używa Context.

Jedyne powody, dla których używam Redux dla mnie to:

• Chcesz globalnego obiektu stanu (z różnych powodów, takich jak możliwość debugowania, trwałość ...)
• Twoja aplikacja jest lub będzie duża i powinna być dostosowana do wielu programistów: w takim przypadku prawdopodobnie potrzebujesz poziomu pośredniego (tj. Systemu zdarzeń): uruchamiasz zdarzenia (w przeszłości), a następnie osoby, których nie znasz w swoim organizacja może ich słuchać

Prawdopodobnie nie potrzebujesz poziomu pośredniego dla całej aplikacji, więc dobrze jest mieszać style i używać lokalnego stanu / kontekstu i Redux w tym samym czasie.

• Jeśli potrzebujesz oprogramowania pośredniczącego do różnych celów. Na przykład rejestrowanie akcji, raportowanie błędów, wysyłanie innych żądań w zależności od odpowiedzi serwera itp.
• Gdy dane pochodzące z wielu punktów końcowych wpływają na pojedynczy komponent / widok.
• Gdy chcesz mieć większą kontrolę nad akcjami w swoich aplikacjach. Redux umożliwia śledzenie działań i zmian danych, znacznie upraszcza debugowanie.
• Jeśli nie chcesz, aby odpowiedź serwera bezpośrednio zmieniała stan Twojej aplikacji. Redux dodaje warstwę, w której możesz zdecydować, jak, kiedy i czy te dane mają zostać zastosowane. Wzorzec obserwatora. Zamiast tworzyć wielu wydawców i subskrybentów w całej aplikacji, wystarczy podłączyć komponenty do sklepu Redux.

Od: Kiedy używać Redux?