Recently we had a chance to implement the same functionality with two different client stacks. One of them is using Redux and the other is Apollo. We would like to share with you our experience and the pros and cons of using one or another. Keep in mind that in this blog post, we assume that you have at least minimum knowledge of what Redux and React Apollo is.
If you don’t know what it is then allow us to explain it beforehand to get a better perspective of Apollo, Redux development.
Redux Development
Redux is a predictable state container for JavaScript apps. It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time travelling debugger.
You can use Redux together with React, or with any other view library. It is tiny (2kB, including dependencies), but has a large ecosystem of add-ons available.
Apollo Client
Apollo Client is a comprehensive state management library for JavaScript that enables you to manage both local and remote data with GraphQL. Use it to fetch, cache, and modify application data, all while automatically updating your UI.
Apollo Client helps you structure code in an economical, predictable, and declarative way that’s consistent with modern development practices. The core apollo/client library provides built-in integration with React, and the larger Apollo community maintains integrations for other popular view layers.
Salient Features of Apollo
- Declarative data fetching
- Excellent developer experience
- Designed for modern React
- Incrementally adoptable
- Universally compatible
- Community-driven.
Now when we have described both, let’s step further and understand in detailed manner whether to opt for Apollo or Redux development?
Key Differences Between Apollo and Redux Development
Developers describe Apollo as GraphQL server for Express, Connect, Hapi, Koa and more”. Build a universal GraphQL API on top of your existing REST APIs, so you can ship new application features fast without waiting on backend changes. On the other hand, Redux is detailed as “Predictable state container for JavaScript apps”.
- Redux helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time-travelling debugger.
- Apollo and Redux are primarily classified as “Platform as a Service” and “State Management Library” tools respectively. “From the creators of Meteor” is the primary reason why developers consider Apollo over the competitors, whereas “State is predictable” was stated as the key factor in picking Redux.
- Apollo and Redux are both open source tools. It seems that Redux with 49.5K GitHub stars and 12.8K forks on GitHub has more adoption than Apollo with 7.55K GitHub stars and 940 GitHub forks.
- Instagram, Intuit, and OpenGov are some of the popular companies that use Redux, whereas Apollo is used by CircleCI, Swat.io, and Flexport. Redux has a broader approval, being mentioned in 1036 company stacks & 836 developers stacks; compared to Apollo, which is listed in 131 company stacks and 127 developer stacks.
- Calling the API both with Redux and React Apollo is quite simple. With Redux we emit an action which gets the data out of the store and then calls an api service. With React Apollo we write a mutation query inside the component, and then directly call it inside the component.
- Whenever we implement a feature we always write an e2e test for it. With GraphQL we start a mock server with mocked resolvers. Because GraphQL enforces you to write correct queries, we are quite confident that the things we mock in our tests represent real life scenarios.
- If you are using REST the situation becomes more difficult. So even though you may have passing E2E tests you may still get production issues. Another solution is to start the whole server when running E2E tests, but that brings a lot of additional moving parts that can get flaky and writing tests becomes a lot more difficult.
- Both web and mobile parts of the project are using Typescript. To have proper type checking on Redux we have to write manually the types for actions and payloads, then we have mappings between actions and reducers. GraphQL on the other hand has type generation (Apollo Tooling). Also both WebStorm and VS Code have plugins for GraphQL which include auto completion for your queries.
You Might Also Like – Top 10 Trends Of Mobile App Development In 2021
Now allow us to conclude. But before that one more thing that you must consider again is the to know which companies are using both the Apollo & Redux. Apollo is used by Atolye15, The New York Times, Medium, Graphy, CircleCI while the Redux development is currently used by Instagram, Amazon, Robinhood, Bepro Company et cetera.
Now the major comparison is almost done and by now you must have been in good position to decide, what to choose Apollo or Redux development for your project. Feel free to reach us in case you need more guidance. Till then stay amazing.
