Convex with TanStack Start

Server-Side Rendering and Live Queries

TanStack Start routes render on the server for the first pageload of a browsing session. Neither the React Query nor standard Convex useQuery() hooks kick off requests for this data during this initial SSR pass, but the React Query hook useSuspenseQuery() does. The React Query client is then serialized with whatever data was loaded to make it available in the browser at hydration time. This reduces rendering on the server and updating on the client from two steps to one step: isomorphic data fetching with a single hook.

Try reloading this page to see the difference between useSuspenseQuery() and useQuery().

7
User 78984/23/25, 7:42 AM

hi James! Could you let the customer know we've fixed their issue?

7
User 76074/22/25, 2:21 AM

hello Jamie... how was your weekend?

7
User 76074/22/25, 2:21 AM

hi Jamie; how's the weather in SF?

2
User 21764/19/25, 11:35 AM

hello Emma- what's your favorite ice cream place?

7
User 79694/17/25, 11:40 PM

hey Jamie- I'll be late to make the meeting tomorrow morning

7
User 70854/17/25, 4:04 AM

hey Jamie! how was your weekend?

9
User 98444/14/25, 3:49 AM

hi Jamie; Could you let the customer know we've fixed their issue?

9
User 98444/14/25, 3:49 AM

hi Emma... Could you let the customer know we've fixed their issue?

1
User 1894/10/25, 5:14 AM

Hi Jamie! what's your favorite ice cream place?

1
User 1894/10/25, 5:14 AM

hello James; Could you let the customer know we've fixed their issue?

9
User 9154/9/25, 4:12 PM

Hi Emma, how's the weather in SF?

6
User 684/9/25, 4:12 PM

hello James... what's your favorite ice cream place?

8
User 834/9/25, 4:12 PM

hello Nipunn; what's your favorite ice cream place?

7
User 7064/9/25, 4:12 PM

hello Jamie- how was your weekend?

3
User 3314/9/25, 4:12 PM

Hi James; what's your favorite ice cream place?

5
User 5294/9/25, 4:12 PM

hi James... how was your weekend?

7
User 7494/9/25, 4:12 PM

Hi James- Could you let the customer know we've fixed their issue?

5
User 5234/9/25, 4:12 PM

Hi Emma... Could you let the customer know we've fixed their issue?

9
User 9664/9/25, 4:12 PM

hello James- how was your weekend?

2
User 2644/9/25, 4:12 PM

hey Emma- how's the weather in SF?

1const { data } = useSuspenseQuery(convexQuery(
2  api.messages.listMessages,
3  { channel: "chatty" }
4))
1const { data, isPending } = useQuery(convexQuery(
2  api.messages.listMessages,
3  { channel: "chatty" }
4))

On the browser these queries resume their subscriptions which you can see by .

Another way to opt into server-side data loading is to load the query in a loader.

Learn More

TanStack Start SSR Guide