Initial Data

The initial data plugin lets you show data immediately before the fetch completes, such as prefetched or server-rendered data.

Installation

npm install @spoosh/plugin-initial-data

Usage

import { initialDataPlugin } from "@spoosh/plugin-initial-data";

const plugins = [initialDataPlugin()];

// Show prefetched data immediately, then refetch in background
const { data, isInitialData } = useRead(
  (api) => api.posts.$get(),
  { initialData: prefetchedPosts }
);

Without Background Refetch

To skip the background refetch and just use the initial data:

const { data } = useRead(
  (api) => api.posts.$get(),
  {
    initialData: prefetchedPosts,
    refetchOnInitialData: false,
  }
);

Options

Per-Request Options

Option	Type	Default	Description
`initialData`	`TData`	-	Data to show immediately on first mount
`refetchOnInitialData`	`boolean`	`true`	Whether to refetch after showing initial data

Result

Property	Type	Description
`isInitialData`	`boolean`	`true` if currently showing initial data (not yet fetched)

Server-Side Rendering

createClient automatically generates Next.js cache tags from the API path:

import { createClient } from "@spoosh/core";

const api = createClient<ApiSchema>({ baseUrl: process.env.API_URL! });

// Auto-generates: next: { tags: ['posts'] }
const { data: posts } = await api.posts.$get();

For a complete SSR example with cache invalidation, see Next.js Plugin - With Initial Data.