Skip to main content

Overview

mobx-tanstack-query is a library for integration tanstack-query library with MobX.
Combines the power of TanStack Query’s caching and async state management with MobX’s reactivity.

Motivation​

  1. Universal Approach
    Enables using TanStack Query in MobX-driven projects, including non-React environments (e.g., Vue, Svelte, or vanilla JS).

  2. State Synchronization
    Automatically syncs TanStack Query’s cache state with MobX reactive systems, ensuring data consistency.

  3. Flexible Integration
    Lets you use TanStack Query’s familiar API alongside MobX reactions for automatic cache invalidation and refetching.

  4. Performance Optimization
    Combines TanStack Query’s efficient query caching with MobX’s granular updates to minimize unnecessary re-renders.

Pros and cons​

Pros:

  • MobX reactivity intergration with TanStack Query power.

Cons:

  • Requires basic understanding of MobX reactions.
  • Adds a small bundle size overhead (~2KB) for the integration layer.
  • Some React-specific TanStack Query features are unavailable.