Should You Use React-Query?

At first glance React Query, might seem like the ultimate solution to your React app's problems, but in this blog; you will discover that React Query might not be the magic bullet it's hyped up to be.

At the beginning of 2022, I was just as excited as you might be about React Query. It promised to revolutionize the way we handle state management and data fetching in React applications. However, as I spent more time with it, my initial enthusiasm turned into frustration.

React Query claims to solve problems by making your code more declarative, flattening imperative code, and providing a centralized cache for state management. It also suggests eliminating async/await, timers, and retry logic by using its API. Additionally, it brings in Tanstack for low-level control. Sounds amazing, right?

But here's the catch – React Query is gaslighting you. It promotes a declarative approach, suggesting that all your problems stem from using an imperative approach to programming. In reality, it's deciding your reality for you. It wants you to toss out essential programming techniques like global state management, async/await, and manual API calls.

This approach contradicts the fundamental principles of programming. If React Query can "solve" your problems by not letting you deal with them directly, then why were you dealing with them in the first place? The answer is simple: you had to.

Regardless of how much React Query hides, your app will still need to handle reloading and waiting, merging data from backend calls, and interacting with various aspects like browser security, state, and logging. By hiding these complexities, React Query forces you to deal with them in the worst possible place – your components.

While React Query simplifies data loading, it complicates the handoff and pickup of data. This approach may lead to a more convoluted codebase in the long run.

Before rushing to implement React Query as a solution, take a step back and consider the root causes of the issues in your code. Often, problems arise because there were no rules governing the quality and structure of the code from the start.

In summary, React Query might appear to be the savior of your React app, but it's essential to critically evaluate whether it genuinely solves your problems or merely shifts them around. Instead of falling for the sales pitch, focus on addressing the real issues within your codebase.

Before adding a new tool like React Query to your stack, ensure that you've established coding standards and best practices to maintain a clean and efficient codebase. Remember, fixing a problem is always more effective than just moving it around, cheers!

Author: Pete Heard

Pete is the founder of Logic Room. He designs the companies core material for JavaScript architecture, test automation and software team leadership.

LinkedIn