OSS探訪

TanStack Query — APIから取得するデータのキャッシュ・再取得・更新をまとめて管理する

スコアの見方

OSS規模スコアはStars・Watchers・Forks・Contributorsを対数圧縮して重み付けした現在の規模指標(上限なし)です。発掘スコアは現在のOSS規模スコアから発掘時点のOSS規模スコアを引いた値、更新ペースは直近30日Commit数、成長モメンタムは直近の観測期間におけるOSS規模スコア差、OSS健全度は取得できた更新状況・Community Health・Releaseの0〜100評価です。

Stars
50,342
主要言語
TypeScript
ライセンス
MIT
リポジトリ最終更新
2026/09/21

概要

TanStack Queryは、REST、GraphQL、Promiseなどから取得する非同期データを、キャッシュ、再取得、ページネーション、更新処理と一緒に管理するライブラリです。React Queryをはじめ、Vue、Solid、Svelteなど複数のフレームワーク向けパッケージを提供します。

特徴と向いている用途

公式資料に基づく紹介・実機未検証 · 内容確認日:

取得・キャッシュ・再取得を一つのクエリとして管理する

データ取得処理にquery keyを付け、キャッシュ、再取得、バックグラウンド更新、キャンセルなどを共通の仕組みで扱えます。

出典:[2][3]

ページネーション・無限スクロール・Mutationを扱う

一覧のページ送りや無限スクロール、更新系リクエスト、依存するクエリなどを非同期データ管理の流れに組み込めます。

出典:[2]

APIデータと画面の同期処理が複雑になったWebアプリに

同じAPIデータを複数画面で参照し、再取得条件や更新後のキャッシュ整合性を個別実装したくない場合に向きます。

出典:[2]

ローカルUI状態とサーバー側データを分けて考える

TanStack Queryの中心は非同期に取得するサーバー側データです。入力途中の値や表示開閉など、アプリ内だけで完結する状態は別の状態管理手段と役割分担します。

出典:[2][4]

参考にした公式資料

  1. [1]TanStack/query repository(2026-09-21)
  2. [2]TanStack Query README(2026-09-21)
  3. [3]React Query installation(2026-09-21)
  4. [4]@tanstack/react-query package(2026-09-21)
  5. [5]TanStack Query MIT license(2026-09-21)
編集部からの補足

TanStack Queryはフォーム入力やモーダル開閉のようなローカルUI状態を一括管理するライブラリではなく、API等から取得する非同期データの同期・キャッシュを主対象にしています。現在の`@tanstack/react-query`は5.103.1で、React 18/19をpeer dependencyとしています。

3ステップで試す

  1. 1

    React Queryを追加

    React向けの公式パッケージをプロジェクトへ追加します。

    npm i @tanstack/react-query
  2. 2

    QueryClientをアプリへ接続

    QueryClientを作成し、QueryClientProviderでアプリへ提供します。

    const queryClient = new QueryClient(); <QueryClientProvider client={queryClient}>…</QueryClientProvider>
  3. 3

    最初のクエリを定義

    一意なqueryKeyと取得関数を指定し、取得・キャッシュ・再取得の基本動作を確認します。

    useQuery({ queryKey: ["todos"], queryFn: fetchTodos })
公式READMEで確認

成長

成長の推移 · 直近30日

50,342 Stars

推移データを蓄積中です。

開発アクティビティ

直近90日・週次

Commit(直近30日)
198
Open PR
119

開発アクティビティを蓄積中です。

Built with

カテゴリとタグ

GitHubデータ

GitHubのデータGitHubの詳細データを見る

GitHub Topics

  • react
  • hooks
  • fetch
  • cache
  • async
  • rest
  • graphql
  • data
  • query
  • stale
  • stale-while-revalidate
  • update
Stars
50,342
Forks
4,242
Watchers
265
Open Issues
53
Contributors
461
主要言語
TypeScript
ライセンス
MIT
リポジトリ最終更新
2026/09/21

このOSSの使い方や活用事例をMarkdownで投稿できます。管理者が承認した後に公開されます。

情報の誤りを報告

掲載内容に誤りや古い情報があればお知らせください。