saga-query initial release

June 16, 2021 on Eric Bower's blog

I’m excited to officially announce the initial release of a new library I wrote called saga-query.

For the past month, most of my free time has been dedicated to building a new way to manage data fetching using redux and redux-saga, primarily for react apps. My goal for this library is to create a koa-like middleware system for interacting with APIs using redux-saga.

There are a lot of common processes to fetching API data:

On top of those common ETL processes, there’s also UX-specific functionality baked into it:

There’s a lot going on here, not to mention the asynchronous nature of javascript makes it even more complicated. Creating common abstractions that work for the needs of every web app is difficult. It’s difficult to construct common abstractions even for a specific app’s needs.

I love koa, it’s a simple web server written in node.js that creates a robust middleware system that allows end-developers to manage API requests and responses. I thought to myself: what if we did that same thing on the front-end? What if we could create a middleware system using redux-saga that handles all the ETL logic of interacting with an API? That idea culminated in saga-query.

This library was ultimately inspired by react-query, redux-toolkit, and koajs.

Those libraries offer a ton of functionality for data fetching and caching.

The redux maintainers have done a great job moving the state management ecosystem forward by creating common abstractions people can use to reduce boilerplate. However, there are no common abstractions being built for people using redux-saga which is my library of choice for medium to large sized projects. redux-toolkit heavily prefers redux-thunk and has little interest in supporting paradigms that revolve around sagas.

react-query has made the distinction clear between UI state and API data for state management. Data, they argue, should be automatically cached and not something the end-developer needs to think about. I love this idea because caching API data is a huge part of constructing a front-end application. However, for medium to large sized projects, I’ve inevitably needed to control the async flow control as well as the caching logic for my API data. It’s not uncommon to performance tune my selectors, build special indexes to make queries faster, and to leverage memoization with reselect to squeeze performance out of my data caching layer. I’m also not a fan of every piece of business logic living inside of the view layer, react. I think with react-query, react is consuming to entire stack and I find that to be less than idea. I want my side-effects to be treated as data and separated from my view layer. For these reasons and more, react-query is not something I would reach for unless it was a small application.

To learn more about why I prefer redux-saga and treating side-effects as data, read my previous article on redux-saga style guide or simplify testing async I/O in javascript.

If you’re like me, someone who prefers treating side-effects as data and wants full control over the data synchronization of your application, I recommend giving saga-query a try. This library, coupled with robodux will not only reduce boilerplate, but give you total control over fetching and caching logic using a koa-style middleware.

Visit the Github repo to learn more.


Articles from blogs I read

Generated by openring

The Fediverse can be pretty toxic

Mastodon, inspired by GNU social, together with Pleroma, form the most popular components of what we know as the “Fediverse” today. All of them are, in essence, federated, free software Twitter clones, interoperable with each other via the ActivityPub protoc…

via Drew DeVault's blog July 9, 2022

Spearphishing: it can happen to you too

Image generated by MidJourney -- The Fool in a woodcut tarot card style For some reason, LinkedIn has become the de-facto social network for professionals. It is viewed as a powerful networking and marketing site that lets professionals communicate, find new…

via Xe's Blog July 9, 2022

SourceHut is committed to making IRC better

Internet Relay Chat (IRC) is a wonderful protocol with a 34-year history of helping free software, there at every step alongside the rise of the internet. Many real-time chat empires have risen and fallen during its tenure, some of them leaving behind lesson…

via Blogs on Sourcehut July 6, 2022