redux-requests
A Redux middleware and reducer that prevents duplicate HTTP requests by tracking in-flight requests.
What is redux-requests?
redux-requests is a Redux middleware and reducer library that prevents duplicate HTTP requests by tracking in-flight requests. It solves the problem of multiple components triggering identical API calls simultaneously, which wastes bandwidth and causes unnecessary re-renders. The library automatically cancels redundant requests without requiring developers to write manual deduplication logic.
Redux developers building applications with frequent API calls, particularly those with multiple components that may request the same data simultaneously. It's especially useful for React/Redux applications where components mount independently and need shared data.
Developers choose redux-requests because it eliminates boilerplate code for request deduplication while maintaining full control over request handling. Unlike manual solutions, it integrates cleanly with Redux middleware and keeps views stateless.
Overview
Manages in-flight requests with a Redux reducer to avoid issuing duplicate requests https://idolize.github.io/redux-requests
Use Cases
Best For
- Preventing duplicate API calls in Redux applications
- Managing shared data fetches across multiple React components
- Reducing bandwidth usage from redundant HTTP requests
- Simplifying action creators that make API calls
- Handling concurrent data requests in single-page applications
- Eliminating manual request tracking logic in Redux
Not Ideal For
- Applications not using Redux, as the library is tightly coupled to Redux's middleware and reducer system.
- Projects already leveraging modern data-fetching libraries like React Query or RTK Query, which include deduplication and caching out of the box.
- Systems requiring advanced request features such as response caching, automatic retries, or complex error handling, since redux-requests focuses only on preventing duplicates.
- Teams preferring a zero-configuration or all-in-one solution, as redux-requests requires manual integration of both reducer and middleware.
Pros & Cons
Pros
Prevents duplicate HTTP requests by tracking in-flight requests with a unique URL hash, eliminating the need for manual tracking logic as shown in the naive vs new code examples.
Provides `createRequestMiddleware` and `requestsReducer` that integrate directly into Redux middleware chains and state management, allowing easy adoption without major refactoring.
The `attemptRequest` function simplifies action creation by automatically adding required `meta.httpRequest` metadata, reducing repetitive code changes for common use cases.
Allows custom state selectors to locate the request reducer's state in the store, offering adaptability for different Redux store structures.
Cons
For full control beyond the helper, developers must manually add `meta.httpRequest` fields to actions, which is error-prone and adds boilerplate, as seen in the example without `attemptRequest`.
Focuses solely on request deduplication; lacks built-in caching, retry mechanisms, or advanced error handling, requiring additional libraries or custom code for comprehensive data fetching.
Tightly coupled to Redux, making it incompatible with applications using other state management systems or those transitioning away from Redux.
Requires configuring both middleware and reducer, which can complicate Redux store setup, especially in larger applications with multiple middleware layers.
Frequently Asked Questions
Related Projects
reselectSelector library for Redux
redux-loggerLogger for Redux
redux-ormNOT MAINTAINED – A small, simple and immutable ORM to manage relational data in your Redux store.
redux-undo:recycle: higher order reducer to add undo/redo functionality to redux state containers
Found a gem we're missing?
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.