Data Fetching

How each meta-framework loads data for a route before or during render.

Next.js

Server Components can await fetch() or call databases directly during render, with Next’s extended fetch providing built-in request memoization and caching controls. Route Handlers offer an alternative for client-triggered or externally consumed data fetching.

Nuxt

Nuxt provides composables like useFetch and useAsyncData that run isomorphically, deduplicating requests between server and client and serializing the result into the initial payload to avoid refetching on hydration. These composables integrate with Nuxt’s server/api routes or any external endpoint.

SvelteKit

Each route can export a load function from +page.ts (universal, runs on server and client) or +page.server.ts (server-only), returning data that’s typed and passed directly into the page component as props. Layouts have their own load functions whose data merges down to child pages.

SolidStart

SolidStart exposes server functions (via "use server" directives) that can be called directly from route code and are automatically split so only a network call ships to the client, letting data loading colocate with components without a separate API layer. Route-level data loading composes these server functions with Solid’s reactive primitives like createResource.

TanStack Start

Routes define a loader on the route object that runs before the route renders, with results cached and revalidated by TanStack Router/Query integration. Loaders are fully typed end-to-end, so the data returned flows into the component with no manual type annotations.

Remix

Each route module exports a loader for reads and an action for writes/mutations, both running server-side and returning data via the route’s useLoaderData/useActionData hooks. This request/response-centric model tightly couples data fetching to route lifecycle and form submissions.

Astro

Astro components fetch data in the top-level “frontmatter” fence (between --- markers), where await fetch() or direct database calls run at build or request time depending on the rendering mode. There’s no separate loader convention — fetched values are simply local variables used in the template below.

Qwik City

Qwik City provides routeLoader$, a serializable function that runs on the server and streams its result into the client without needing a client-side fetch, integrating with resumability so no rehydration step is required. Mutations use the companion routeAction$ API, both colocated with the route module.