Чем отличается TanStack Query от Redux с точки зрения управления серверным состоянием?

import { useQuery } from '@tanstack/react-query';

function Posts() {
  const { data, isLoading, error } = useQuery({
    queryKey: ['posts'],
    queryFn: () => fetch('/api/posts').then(res => res.json()),
  });

  if (isLoading) return 'Loading...';
  if (error) return 'Error!';
  return data.map(post => {post.title});
}

// actions.js
export const fetchPosts = () => async (dispatch) => {
  dispatch({ type: 'posts/fetchStart' });
  try {
    const res = await fetch('/api/posts');
    const data = await res.json();
    dispatch({ type: 'posts/fetchSuccess', payload: data });
  } catch (err) {
    dispatch({ type: 'posts/fetchError', payload: err });
  }
};

// reducer.js
const initialState = { data: [], isLoading: false, error: null };
export default function postsReducer(state = initialState, action) {
  switch (action.type) {
    case 'posts/fetchStart': return { ...state, isLoading: true };
    case 'posts/fetchSuccess': return { ...state, isLoading: false, data: action.payload };
    case 'posts/fetchError': return { ...state, isLoading: false, error: action.payload };
    default: return state;
  }
}