Tanstack Svelte Query Best Practices

TanStack Svelte Query Best Practices

Treat server data as reactive cache state with explicit request ownership and cache identity; this produces clear query-state views and mutations that refresh only the data they affect.

Library Sources

• GitHub repository ID: TanStack/query
• Context7 library ID: /tanstack/query
• DeepWiki repository ID: TanStack/query

Use Context7 for current documentation and DeepWiki for implementation details.

References

Read the references that apply to the current task before writing or reviewing TanStack Svelte Query code.

1. Let TanStack Query own server-data lifecycle and reactive cache identity.
   • Let TanStack Query own one server-data lifecycle instead of duplicating requests in effects or handlers.
   • Include every response-changing input in cache identity so filters, tenant, locale, and pagination cannot share stale results.
   • Read request inputs exclusively from the query-function context, never from captured request variables.
   • Preserve missing required IDs and disable the request instead of issuing a fabricated empty-record request.
   • Partition visibility-sensitive cache entries by non-secret actor identity.
   • Give createQuery an accessor for reactive query options so changing inputs update the query instead of freezing options.
2. Resolve query status before stateful presentation consumes data.
   • Resolve pending, error, empty, and success states in an outer loader before mounting stateful presentation.
   • Publish identity at the loader boundary through loader prop contracts and give resolved components only the data they need.
   • Read query fields directly through reactive result consumption, because destructuring snapshots their values.
3. Keep mutation lifecycle and invalidation scoped to the submitting operation.
   • Choose one submission lifecycle; a form cannot simultaneously own SvelteKit enhancement and a client mutation.
   • Pass changed operation input via mutation variables, keeping definition configuration stable.
   • Put shared cache policy in the definition and component-specific UI work at the call site.
   • Keep each invocation's success, failure, and settlement behavior at the mutation call site, not an effect that loses invocation identity.
   • Invalidate the narrow stale record or list family.