diff --git a/.github/workflows/e2e-tests.yml b/.github/workflows/e2e-tests.yml
index 3678cd19f2..7dff92fade 100644
--- a/.github/workflows/e2e-tests.yml
+++ b/.github/workflows/e2e-tests.yml
@@ -45,6 +45,7 @@ jobs:
         run: |
           pnpm --filter @tanstack/db-ivm build
           pnpm --filter @tanstack/db build
+          pnpm --filter @tanstack/react-db build
           pnpm --filter @tanstack/electric-db-collection build
           pnpm --filter @tanstack/offline-transactions build
           pnpm --filter @tanstack/query-db-collection build
@@ -68,6 +69,16 @@ jobs:
         env:
           ELECTRIC_URL: http://localhost:3000
 
+      - name: Install Playwright browsers
+        run: |
+          cd examples/react/start-ssr-e2e
+          pnpm exec playwright install --with-deps chromium
+
+      - name: Run React Start SSR E2E tests
+        run: |
+          cd examples/react/start-ssr-e2e
+          pnpm test:e2e
+
       - name: Run Node SQLite persisted collection E2E tests
         run: |
           cd packages/node-db-sqlite-persistence
diff --git a/docs/collections/local-only-collection.md b/docs/collections/local-only-collection.md
index 17bf51ef4b..2f016baac5 100644
--- a/docs/collections/local-only-collection.md
+++ b/docs/collections/local-only-collection.md
@@ -192,10 +192,12 @@ export const modalStateCollection = createCollection(
 
 // Use in component
 function UserProfileModal() {
-  const { data: modals } = useLiveQuery((q) =>
-    q.from({ modal: modalStateCollection })
-      .where(({ modal }) => eq(modal.id, 'user-profile'))
-  )
+  const { data: modals } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ modal: modalStateCollection })
+        .where(({ modal }) => eq(modal.id, 'user-profile')),
+  })
 
   const modalState = modals[0]
 
@@ -248,10 +250,12 @@ export const formDraftsCollection = createCollection(
 
 // Use in component
 function CreatePostForm() {
-  const { data: drafts } = useLiveQuery((q) =>
-    q.from({ draft: formDraftsCollection })
-      .where(({ draft }) => eq(draft.id, 'new-post'))
-  )
+  const { data: drafts } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ draft: formDraftsCollection })
+        .where(({ draft }) => eq(draft.id, 'new-post')),
+  })
 
   const currentDraft = drafts[0]
 
diff --git a/docs/collections/local-storage-collection.md b/docs/collections/local-storage-collection.md
index 171e5cb9b4..59d3a981c0 100644
--- a/docs/collections/local-storage-collection.md
+++ b/docs/collections/local-storage-collection.md
@@ -263,10 +263,12 @@ export const userPreferencesCollection = createCollection(
 
 // Use in component
 function SettingsPanel() {
-  const { data: prefs } = useLiveQuery((q) =>
-    q.from({ pref: userPreferencesCollection })
-      .where(({ pref }) => eq(pref.id, 'current-user'))
-  )
+  const { data: prefs } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ pref: userPreferencesCollection })
+        .where(({ pref }) => eq(pref.id, 'current-user')),
+  })
 
   const currentPrefs = prefs[0]
 
diff --git a/docs/collections/query-collection.md b/docs/collections/query-collection.md
index 73f3511edc..b03e6dbf89 100644
--- a/docs/collections/query-collection.md
+++ b/docs/collections/query-collection.md
@@ -25,13 +25,15 @@ npm install @tanstack/query-db-collection @tanstack/query-core @tanstack/db
 
 ```typescript
 import { QueryClient } from "@tanstack/query-core"
-import { createCollection } from "@tanstack/db"
+import { DbClient, collectionOptions } from "@tanstack/db"
 import { queryCollectionOptions } from "@tanstack/query-db-collection"
 
 const queryClient = new QueryClient()
+const db = new DbClient()
 
-const todosCollection = createCollection(
+const todosCollection = collectionOptions(
   queryCollectionOptions({
+    id: "todos",
     queryKey: ["todos"],
     queryFn: async () => {
       const response = await fetch("/api/todos")
@@ -41,6 +43,8 @@ const todosCollection = createCollection(
     getKey: (item) => item.id,
   })
 )
+
+const todos = db.collection(todosCollection)
 ```
 
 ## Configuration Options
@@ -70,11 +74,12 @@ If your app already uses TanStack Query's `queryOptions` helper (e.g. from `@tan
 
 ```typescript
 import { QueryClient } from "@tanstack/query-core"
-import { createCollection } from "@tanstack/db"
+import { DbClient, collectionOptions } from "@tanstack/db"
 import { queryCollectionOptions } from "@tanstack/query-db-collection"
 import { queryOptions } from "@tanstack/react-query"
 
 const queryClient = new QueryClient()
+const db = new DbClient()
 
 const listOptions = queryOptions({
   queryKey: ["todos"],
@@ -84,14 +89,17 @@ const listOptions = queryOptions({
   },
 })
 
-const todosCollection = createCollection(
+const todosCollection = collectionOptions(
   queryCollectionOptions({
+    id: "todos",
     ...listOptions,
     queryFn: (context) => listOptions.queryFn!(context),
     queryClient,
     getKey: (item) => item.id,
   }),
 )
+
+const todos = db.collection(todosCollection)
 ```
 
 If `queryFn` is missing at runtime, `queryCollectionOptions` throws `QueryFnRequiredError`.
diff --git a/docs/collections/trailbase-collection.md b/docs/collections/trailbase-collection.md
index 938e714a52..741cd8d80d 100644
--- a/docs/collections/trailbase-collection.md
+++ b/docs/collections/trailbase-collection.md
@@ -194,11 +194,13 @@ export const todosCollection = createCollection<SelectTodo, Todo>(
 
 // Use in component
 function TodoList() {
-  const { data: todos } = useLiveQuery((q) =>
-    q.from({ todo: todosCollection })
-      .where(({ todo }) => not(todo.completed))
-      .orderBy(({ todo }) => todo.created_at, 'desc')
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: todosCollection })
+        .where(({ todo }) => not(todo.completed))
+        .orderBy(({ todo }) => todo.created_at, 'desc'),
+  })
 
   const addTodo = (text: string) => {
     todosCollection.insert({
diff --git a/docs/framework/react/overview.md b/docs/framework/react/overview.md
index 1c10d644c6..0b72d90d06 100644
--- a/docs/framework/react/overview.md
+++ b/docs/framework/react/overview.md
@@ -17,19 +17,34 @@ For comprehensive documentation on writing queries (filtering, joins, aggregatio
 
 ## Basic Usage
 
+Create a `DbClient` and provide it to your React tree:
+
+```tsx
+import { DbClient, DbProvider } from '@tanstack/react-db'
+
+const dbClient = new DbClient()
+
+root.render(
+  <DbProvider client={dbClient}>
+    <App />
+  </DbProvider>
+)
+```
+
 ### useLiveQuery
 
 The `useLiveQuery` hook creates a live query that automatically updates your component when data changes:
 
 ```tsx
-import { useLiveQuery, eq } from '@tanstack/react-db'
+import { and, eq, gt, useDbClient, useLiveQuery } from '@tanstack/react-db'
 
 function TodoList() {
-  const { data, isLoading } = useLiveQuery((q) =>
-    q.from({ todos: todosCollection })
-     .where(({ todos }) => eq(todos.completed, false))
-     .select(({ todos }) => ({ id: todos.id, text: todos.text }))
-  )
+  const { data, isLoading } = useLiveQuery({
+    query: (q) =>
+      q.from({ todos: todoCollection })
+       .where(({ todos }) => eq(todos.completed, false))
+       .select(({ todos }) => ({ id: todos.id, text: todos.text })),
+  })
 
   if (isLoading) return <div>Loading...</div>
 
@@ -41,29 +56,56 @@ function TodoList() {
 }
 ```
 
-### Dependency Arrays
+### Query Identity
 
-All query hooks (`useLiveQuery`, `useLiveInfiniteQuery`, `useLiveSuspenseQuery`) accept an optional dependency array as their last parameter. This array works similarly to React's `useEffect` dependencies - when any value in the array changes, the query is recreated and re-executed.
+React query hooks derive the live query identity from structured query IR by default. The hook runs the query builder, normalizes the resulting IR, and uses that as the identity. When the derived identity changes, the old live query collection is cleaned up and a new one is created.
 
-#### When to Use Dependency Arrays
-
-Use dependency arrays when your query depends on external reactive values (props, state, or other hooks):
+That means normal structured queries do not need a separate `queryKey`. Collection descriptors provide stable collection IDs, and captured values inside structured expressions become part of the derived identity:
 
 ```tsx
 function FilteredTodos({ minPriority }: { minPriority: number }) {
-  const { data } = useLiveQuery(
-    (q) => q.from({ todos: todosCollection })
+  const { data } = useLiveQuery({
+    query: (q) => q.from({ todos: todoCollection })
            .where(({ todos }) => gt(todos.priority, minPriority)),
-    [minPriority] // Re-run when minPriority changes
-  )
+  })
 
   return <div>{data.length} high-priority todos</div>
 }
 ```
 
-#### What Happens When Dependencies Change
+#### Collection Hooks
+
+`useLiveQuery` resolves collection descriptors from `DbProvider` automatically. Create small collection hooks when components need imperative collection methods like `insert`, `update`, `delete`, or `preload`:
+
+```tsx
+function useTodoCollection() {
+  return useDbClient().collection(todoCollection)
+}
+```
+
+#### When to Use Query Keys
 
-When a dependency value changes:
+Use `queryKey` only when DB cannot derive identity from structured IR, or when you intentionally want to avoid deriving identity on a hot render path. The common case is a functional query variant such as `.fn.where`, `.fn.select`, or `.fn.having`:
+
+```tsx
+function SearchTodos({ search }: { search: string }) {
+  const { data } = useLiveQuery({
+    queryKey: [todoCollection.id, 'search', search],
+    query: (q) => q.from({ todos: todoCollection })
+           .fn.where(({ todos }) =>
+             todos.text.toLowerCase().includes(search.toLowerCase())
+           ),
+  })
+
+  return <div>{data.length} matching todos</div>
+}
+```
+
+In development, `useLiveQuery` enforces this boundary. If the structured IR contains opaque values that cannot be hashed, it throws and points at the path that needs an explicit `queryKey`. If deriving identity becomes expensive across renders, it warns once and suggests adding a `queryKey` as a performance escape hatch.
+
+#### What Happens When Identity Changes
+
+When the derived identity or explicit query key changes:
 1. The previous live query collection is cleaned up
 2. A new query is created with the updated values
 3. The component re-renders with the new data
@@ -71,46 +113,39 @@ When a dependency value changes:
 
 #### Best Practices
 
-**Include all external values used in the query:**
+**Use structured expressions when possible:**
 
 ```tsx
-// Good - all external values in deps
-const { data } = useLiveQuery(
-  (q) => q.from({ todos: todosCollection })
+// Good - DB can derive identity from this structured IR
+const { data } = useLiveQuery({
+  query: (q) => q.from({ todos: todoCollection })
          .where(({ todos }) => and(
            eq(todos.userId, userId),
            eq(todos.status, status)
          )),
-  [userId, status]
-)
-
-// Bad - missing dependencies
-const { data } = useLiveQuery(
-  (q) => q.from({ todos: todosCollection })
-         .where(({ todos }) => eq(todos.userId, userId)),
-  [] // Missing userId!
-)
+})
 ```
 
-**Empty array for static queries:**
+**Add a query key for opaque runtime logic:**
 
 ```tsx
-// No external dependencies - query never changes
-const { data } = useLiveQuery(
-  (q) => q.from({ todos: todosCollection }),
-  []
-)
+const { data } = useLiveQuery({
+  queryKey: [todoCollection.id, 'by-user-fn', userId],
+  query: (q) => q.from({ todos: todoCollection })
+         .fn.where(({ todos }) => todos.userId === userId),
+})
 ```
 
-**Omit the array for queries with no external dependencies:**
+**Omit query keys for static structured queries:**
 
 ```tsx
-// Same as above - no deps needed
-const { data } = useLiveQuery(
-  (q) => q.from({ todos: todosCollection })
-)
+const { data } = useLiveQuery({
+  query: (q) => q.from({ todos: todoCollection }),
+})
 ```
 
+Dependency arrays are still accepted for backwards compatibility, but they warn in development and will be removed in 1.0.
+
 ### useLiveInfiniteQuery
 
 For paginated data with live updates, use `useLiveInfiniteQuery`:
@@ -125,24 +160,20 @@ const { data, pages, fetchNextPage, hasNextPage } = useLiveInfiniteQuery(
     pageSize: 20,
     getNextPageParam: (lastPage, allPages) =>
       lastPage.length === 20 ? allPages.length : undefined
-  },
-  [category] // Re-run when category changes
+  }
 )
 ```
 
-**Note:** The dependency array is only available when using the query function variant, not when passing a pre-created collection.
-
 ### useLiveSuspenseQuery
 
 For React Suspense integration, use `useLiveSuspenseQuery`:
 
 ```tsx
 function TodoList({ filter }: { filter: string }) {
-  const { data } = useLiveSuspenseQuery(
-    (q) => q.from({ todos: todosCollection })
+  const { data } = useLiveSuspenseQuery({
+    query: (q) => q.from({ todos: todoCollection })
            .where(({ todos }) => eq(todos.filter, filter)),
-    [filter] // Re-suspends when filter changes
-  )
+  })
 
   return (
     <ul>
@@ -160,4 +191,4 @@ function App() {
 }
 ```
 
-When dependencies change, `useLiveSuspenseQuery` will re-suspend, showing your Suspense fallback until the new data is ready.
+When the derived identity or explicit `queryKey` changes, `useLiveSuspenseQuery` will re-suspend, showing your Suspense fallback until the new data is ready.
diff --git a/docs/guides/collection-options-creator.md b/docs/guides/collection-options-creator.md
index d1f4d55c4a..25efd2fe56 100644
--- a/docs/guides/collection-options-creator.md
+++ b/docs/guides/collection-options-creator.md
@@ -709,11 +709,14 @@ export function webSocketCollectionOptions<TItem extends object>(
 ## Usage Example
 
 ```typescript
-import { createCollection } from '@tanstack/react-db'
+import { DbClient, collectionOptions } from '@tanstack/react-db'
 import { webSocketCollectionOptions } from './websocket-collection'
 
-const todos = createCollection(
+const db = new DbClient()
+
+const todosCollection = collectionOptions(
   webSocketCollectionOptions({
+    id: 'todos',
     url: 'ws://localhost:8080/todos',
     getKey: (todo) => todo.id,
     schema: todoSchema
@@ -721,6 +724,8 @@ const todos = createCollection(
   })
 )
 
+const todos = db.collection(todosCollection)
+
 // Use the collection
 todos.insert({ id: '1', text: 'Buy milk', completed: false })
 
diff --git a/docs/guides/error-handling.md b/docs/guides/error-handling.md
index dfd4fa0b80..40bb758beb 100644
--- a/docs/guides/error-handling.md
+++ b/docs/guides/error-handling.md
@@ -91,7 +91,9 @@ const syncedCollection = createCollection(
 
 // Component can check error state
 function DataList() {
-  const { data } = useLiveQuery((q) => q.from({ item: syncedCollection }))
+  const { data } = useLiveQuery({
+    query: (q) => q.from({ item: syncedCollection }),
+  })
   const isError = syncedCollection.utils.isError
   const errorCount = syncedCollection.utils.errorCount
   
diff --git a/docs/guides/live-queries.md b/docs/guides/live-queries.md
index 0780871a3b..1d0d089b19 100644
--- a/docs/guides/live-queries.md
+++ b/docs/guides/live-queries.md
@@ -164,14 +164,15 @@ bindings and reactive updates, use live queries instead.
 In React, you can use the `useLiveQuery` hook:
 
 ```tsx
-import { useLiveQuery } from '@tanstack/react-db'
+import { eq, useLiveQuery } from '@tanstack/react-db'
 
 function UserList() {
-  const activeUsers = useLiveQuery((q) =>
-    q
-      .from({ user: usersCollection })
-      .where(({ user }) => eq(user.active, true))
-  )
+  const { data: activeUsers } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ user: usersCollection })
+        .where(({ user }) => eq(user.active, true)),
+  })
 
   return (
     <ul>
@@ -206,7 +207,31 @@ export class UserListComponent {
 }
 ```
 
-> **Note:** React hooks (`useLiveQuery`, `useLiveInfiniteQuery`, `useLiveSuspenseQuery`) accept an optional dependency array parameter to re-execute queries when values change, similar to React's `useEffect`. See the [React Adapter documentation](../framework/react/overview#dependency-arrays) for details on when and how to use dependency arrays.
+> **Note:** React hooks derive query identity from structured query IR by default. Dependency arrays are still accepted for backwards compatibility, but warn in development and will be removed in 1.0. See the [React Adapter documentation](../framework/react/overview#query-identity) for details.
+
+#### When React Needs a Query Key
+
+Use `queryKey` when the query contains opaque runtime logic that cannot be represented in structured IR, such as `.fn.where`, `.fn.select`, or `.fn.having`. The key becomes the explicit identity for that query:
+
+```tsx
+function UserSearch({ search }: { search: string }) {
+  const { data } = useLiveQuery({
+    queryKey: [usersCollection.id, 'search', search],
+    query: (q) =>
+      q
+        .from({ user: usersCollection })
+        .fn.where(({ user }) =>
+          user.name.toLowerCase().includes(search.toLowerCase())
+        ),
+  })
+
+  return <div>{data.length} users</div>
+}
+```
+
+You can also provide a `queryKey` as a performance escape hatch for a very hot render path, but normal structured queries should omit it.
+
+React development builds detect both cases: opaque, unhashable query IR throws with a path-specific error, and repeated expensive identity derivation warns once with the same `queryKey` escape hatch.
 
 For more details on framework integration, see the [React](../framework/react/overview), [Vue](../framework/vue/overview), and [Angular](../framework/angular/overview) adapter documentation.
 
@@ -220,11 +245,12 @@ import { Suspense } from 'react'
 
 function UserList() {
   // This will suspend until data is ready
-  const { data } = useLiveSuspenseQuery((q) =>
-    q
-      .from({ user: usersCollection })
-      .where(({ user }) => eq(user.active, true))
-  )
+  const { data } = useLiveSuspenseQuery({
+    query: (q) =>
+      q
+        .from({ user: usersCollection })
+        .where(({ user }) => eq(user.active, true)),
+  })
 
   // data is always defined - no need for optional chaining
   return (
@@ -251,9 +277,9 @@ The key difference from `useLiveQuery` is that `data` is always defined (never `
 
 ```tsx
 function UserStats() {
-  const { data } = useLiveSuspenseQuery((q) =>
-    q.from({ user: usersCollection })
-  )
+  const { data } = useLiveSuspenseQuery({
+    query: (q) => q.from({ user: usersCollection }),
+  })
 
   // TypeScript knows data is Array<User>, not Array<User> | undefined
   return <div>Total users: {data.length}</div>
@@ -284,9 +310,9 @@ After the initial load, data updates stream in without re-suspending:
 
 ```tsx
 function UserList() {
-  const { data } = useLiveSuspenseQuery((q) =>
-    q.from({ user: usersCollection })
-  )
+  const { data } = useLiveSuspenseQuery({
+    query: (q) => q.from({ user: usersCollection }),
+  })
 
   // Suspends once during initial load
   // After that, data updates automatically when users change
@@ -301,19 +327,18 @@ function UserList() {
 }
 ```
 
-#### Re-suspending on Dependency Changes
+#### Re-suspending on Query Identity Changes
 
-When dependencies change, the hook re-suspends to load new data:
+When the derived query identity changes, the hook re-suspends to load new data:
 
 ```tsx
 function FilteredUsers({ minAge }: { minAge: number }) {
-  const { data } = useLiveSuspenseQuery(
-    (q) =>
+  const { data } = useLiveSuspenseQuery({
+    query: (q) =>
       q
         .from({ user: usersCollection })
         .where(({ user }) => gt(user.age, minAge)),
-    [minAge] // Re-suspend when minAge changes
-  )
+  })
 
   return (
     <ul>
@@ -334,7 +359,7 @@ function FilteredUsers({ minAge }: { minAge: number }) {
   - The query always needs to run (not conditional)
 
 - **Use `useLiveQuery`** when:
-  - You need conditional/disabled queries
+  - You prefer conditional rendering for optional query inputs
   - You prefer handling loading/error states within your component
   - You want to show loading states inline without Suspense
   - You need access to `status` and `isLoading` flags
@@ -343,9 +368,9 @@ function FilteredUsers({ minAge }: { minAge: number }) {
 ```tsx
 // useLiveQuery - handle states in component
 function UserList() {
-  const { data, status, isLoading } = useLiveQuery((q) =>
-    q.from({ user: usersCollection })
-  )
+  const { data, status, isLoading } = useLiveQuery({
+    query: (q) => q.from({ user: usersCollection }),
+  })
 
   if (isLoading) return <div>Loading...</div>
   if (status === 'error') return <div>Error loading users</div>
@@ -355,9 +380,9 @@ function UserList() {
 
 // useLiveSuspenseQuery - handle states with Suspense/ErrorBoundary
 function UserList() {
-  const { data } = useLiveSuspenseQuery((q) =>
-    q.from({ user: usersCollection })
-  )
+  const { data } = useLiveSuspenseQuery({
+    query: (q) => q.from({ user: usersCollection }),
+  })
 
   return <ul>{data.map(user => <li key={user.id}>{user.name}</li>)}</ul>
 }
@@ -377,9 +402,9 @@ const route = {
 // In your component:
 function UserList() {
   // Collection is already loaded, so data is immediately available
-  const { data } = useLiveQuery((q) =>
-    q.from({ user: usersCollection })
-  )
+  const { data } = useLiveQuery({
+    query: (q) => q.from({ user: usersCollection }),
+  })
 
   return <ul>{data?.map(user => <li key={user.id}>{user.name}</li>)}</ul>
 }
@@ -387,28 +412,28 @@ function UserList() {
 
 ### Conditional Queries
 
-In React, you can conditionally disable a query by returning `undefined` or `null` from the `useLiveQuery` callback. When disabled, the hook returns a special state indicating the query is not active.
+For optional inputs, prefer rendering the query component only after the inputs exist. That avoids creating a live query before all required values exist.
 
 ```tsx
 import { useLiveQuery } from '@tanstack/react-db'
 
-function TodoList({ userId }: { userId?: string }) {
-  const { data, isEnabled, status } = useLiveQuery((q) => {
-    // Disable the query when userId is not available
-    if (!userId) return undefined
+function TodosPanel({ userId }: { userId?: string }) {
+  if (!userId) return <div>Please select a user</div>
 
-    return q
-      .from({ todos: todosCollection })
-      .where(({ todos }) => eq(todos.userId, userId))
-  }, [userId])
+  return <TodoList userId={userId} />
+}
 
-  if (!isEnabled) {
-    return <div>Please select a user</div>
-  }
+function TodoList({ userId }: { userId: string }) {
+  const { data } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todos: todosCollection })
+        .where(({ todos }) => eq(todos.userId, userId)),
+  })
 
   return (
     <ul>
-      {data?.map(todo => (
+      {data.map(todo => (
         <li key={todo.id}>{todo.text}</li>
       ))}
     </ul>
@@ -416,32 +441,29 @@ function TodoList({ userId }: { userId?: string }) {
 }
 ```
 
-When the query is disabled (callback returns `undefined` or `null`):
+The callback form can also return `undefined` or `null` to disable a query. This still uses derived identity, so captured structured values do not need a dependency array. When the query is disabled:
 - `status` is `'disabled'`
 - `data`, `state`, and `collection` are `undefined`
 - `isEnabled` is `false`
 - `isLoading`, `isReady`, `isIdle`, and `isError` are all `false`
 
-This pattern is useful for "wait until inputs exist" flows without needing to conditionally render the hook itself or manage an external enabled flag.
-
-### Alternative Callback Return Types
-
-The `useLiveQuery` callback can return different types depending on your use case:
+### Alternative Input Forms
 
 #### Returning a Query Builder (Standard)
 
-The most common pattern is to return a query builder:
+The standard React pattern is an object with a query builder. For structured queries, React derives the identity from the query IR:
 
 ```tsx
-const { data } = useLiveQuery((q) =>
-  q.from({ todos: todosCollection })
-   .where(({ todos }) => eq(todos.completed, false))
-)
+const { data } = useLiveQuery({
+  query: (q) =>
+    q.from({ todos: todosCollection })
+     .where(({ todos }) => eq(todos.completed, false)),
+})
 ```
 
 #### Returning a Pre-created Collection
 
-You can return an existing collection directly:
+You can also subscribe to an existing collection directly:
 
 ```tsx
 const activeUsersCollection = createLiveQueryCollection((q) =>
@@ -449,15 +471,10 @@ const activeUsersCollection = createLiveQueryCollection((q) =>
    .where(({ users }) => eq(users.active, true))
 )
 
-function UserList({ usePrebuilt }: { usePrebuilt: boolean }) {
-  const { data } = useLiveQuery((q) => {
-    // Toggle between pre-created collection and ad-hoc query
-    if (usePrebuilt) return activeUsersCollection
-
-    return q.from({ users: usersCollection })
-  }, [usePrebuilt])
+function UserList() {
+  const { data } = useLiveQuery(activeUsersCollection)
 
-  return <ul>{data?.map(user => <li key={user.id}>{user.name}</li>)}</ul>
+  return <ul>{data.map(user => <li key={user.id}>{user.name}</li>)}</ul>
 }
 ```
 
@@ -466,13 +483,12 @@ function UserList({ usePrebuilt }: { usePrebuilt: boolean }) {
 You can return a configuration object to specify additional options like a custom ID:
 
 ```tsx
-const { data } = useLiveQuery((q) => {
-  return {
-    query: q.from({ items: itemsCollection })
-             .select(({ items }) => ({ id: items.id })),
-    id: 'items-view', // Custom ID for debugging
-    gcTime: 10000 // Custom garbage collection time
-  }
+const { data } = useLiveQuery({
+  query: (q) =>
+    q.from({ items: itemsCollection })
+     .select(({ items }) => ({ id: items.id })),
+  id: 'items-view', // Custom ID for debugging
+  gcTime: 10000 // Custom garbage collection time
 })
 ```
 
@@ -1311,19 +1327,20 @@ import { useLiveQuery } from '@tanstack/react-db'
 import { eq } from '@tanstack/db'
 
 function ProjectList() {
-  const { data: projects } = useLiveQuery((q) =>
-    q.from({ p: projectsCollection }).select(({ p }) => ({
-      id: p.id,
-      name: p.name,
-      issues: q
-        .from({ i: issuesCollection })
-        .where(({ i }) => eq(i.projectId, p.id))
-        .select(({ i }) => ({
-          id: i.id,
-          title: i.title,
-        })),
-    })),
-  )
+  const { data: projects } = useLiveQuery({
+    query: (q) =>
+      q.from({ p: projectsCollection }).select(({ p }) => ({
+        id: p.id,
+        name: p.name,
+        issues: q
+          .from({ i: issuesCollection })
+          .where(({ i }) => eq(i.projectId, p.id))
+          .select(({ i }) => ({
+            id: i.id,
+            title: i.title,
+          })),
+      })),
+  })
 
   return (
     <ul>
@@ -1564,12 +1581,13 @@ import { useLiveQuery } from '@tanstack/react-db'
 import { eq } from '@tanstack/db'
 
 function UserProfile({ userId }: { userId: string }) {
-  const { data: user, isLoading } = useLiveQuery((q) =>
-    q
-      .from({ users: usersCollection })
-      .where(({ users }) => eq(users.id, userId))
-      .findOne()
-  , [userId])
+  const { data: user, isLoading } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ users: usersCollection })
+        .where(({ users }) => eq(users.id, userId))
+        .findOne(),
+  })
 
   if (isLoading) return <div>Loading...</div>
   if (!user) return <div>User not found</div>
@@ -1965,14 +1983,15 @@ You can chain multiple reusable filters:
 ```tsx
 import { useLiveQuery } from '@tanstack/react-db'
 
-const { data } = useLiveQuery((q) => {
-  return q
-    .from({ item: itemsCollection })
-    .where(({ item }) => eq(item.id, 1))
-    .where(activeItemFilter)      // Reusable filter 1
-    .where(verifiedItemFilter)     // Reusable filter 2
-    .select(({ item }) => ({ ...item }))
-}, [])
+const { data } = useLiveQuery({
+  query: (q) =>
+    q
+      .from({ item: itemsCollection })
+      .where(({ item }) => eq(item.id, 1))
+      .where(activeItemFilter)      // Reusable filter 1
+      .where(verifiedItemFilter)     // Reusable filter 2
+      .select(({ item }) => ({ ...item })),
+})
 ```
 
 #### Using with Different Aliases
diff --git a/docs/guides/mutations.md b/docs/guides/mutations.md
index 9a60c47dc5..7a269aa36c 100644
--- a/docs/guides/mutations.md
+++ b/docs/guides/mutations.md
@@ -1653,9 +1653,9 @@ todoCollection.insert({
 
 // Use view key for rendering
 const TodoList = () => {
-  const { data: todos } = useLiveQuery((q) =>
-    q.from({ todo: todoCollection })
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) => q.from({ todo: todoCollection }),
+  })
 
   return (
     <ul>
diff --git a/docs/overview.md b/docs/overview.md
index 63f0965d96..34088d7a04 100644
--- a/docs/overview.md
+++ b/docs/overview.md
@@ -48,21 +48,29 @@ TanStack DB works by:
 - [making optimistic mutations](#making-optimistic-mutations) using transactional mutators
 
 ```tsx
-// Define collections to load data into
-const todoCollection = createCollection({
+// Define stable collection descriptors to load data into
+const todoCollection = collectionOptions({
+  id: 'todos',
   // ...your config
   onUpdate: updateMutationFn,
 })
 
+function useTodoCollection() {
+  return useDbClient().collection(todoCollection)
+}
+
 const Todos = () => {
+  const todosCollection = useTodoCollection()
+
   // Bind data using live queries
-  const { data: todos } = useLiveQuery((q) =>
-    q.from({ todo: todoCollection }).where(({ todo }) => not(todo.completed))
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q.from({ todo: todoCollection }).where(({ todo }) => not(todo.completed)),
+  })
 
   const complete = (todo) => {
     // Instantly applies optimistic state
-    todoCollection.update(todo.id, (draft) => {
+    todosCollection.update(todo.id, (draft) => {
       draft.completed = true
     })
   }
@@ -103,8 +111,9 @@ Collections support three sync modes to optimize data loading:
 With on-demand mode, your component's query becomes the API call:
 
 ```tsx
-const productsCollection = createCollection(
+const productsCollection = collectionOptions(
   queryCollectionOptions({
+    id: 'products',
     queryKey: ['products'],
     queryFn: async (ctx) => {
       // Query predicates passed automatically in ctx.meta
@@ -143,7 +152,7 @@ Collections support `insert`, `update` and `delete` operations. When called, by
 
 ```ts
 // Define collection with persistence handlers
-const todoCollection = createCollection({
+const todoCollection = collectionOptions({
   id: "todos",
   // ... other config
   onUpdate: async ({ transaction }) => {
@@ -151,9 +160,10 @@ const todoCollection = createCollection({
     await api.todos.update(original.id, changes)
   },
 })
+const todosCollection = dbClient.collection(todoCollection)
 
 // Immediately applies optimistic state
-todoCollection.update(todo.id, (draft) => {
+todosCollection.update(todo.id, (draft) => {
   draft.completed = true
 })
 ```
@@ -227,12 +237,14 @@ const todoSchema = z.object({
   priority: z.number().default(0)
 })
 
-const collection = createCollection(
+const todoCollection = collectionOptions(
   queryCollectionOptions({
+    id: "todos",
     schema: todoSchema,
     // ...
   })
 )
+const collection = dbClient.collection(todoCollection)
 
 // Users provide simple inputs
 collection.insert({
@@ -269,16 +281,17 @@ import { useLiveQuery } from '@tanstack/react-db'
 import { eq } from '@tanstack/db'
 
 const Todos = () => {
-  const { data: todos } = useLiveQuery((q) =>
-    q
-      .from({ todo: todoCollection })
-      .where(({ todo }) => eq(todo.completed, false))
-      .orderBy(({ todo }) => todo.created_at, 'asc')
-      .select(({ todo }) => ({
-        id: todo.id,
-        text: todo.text
-      }))
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: todoCollection })
+        .where(({ todo }) => eq(todo.completed, false))
+        .orderBy(({ todo }) => todo.created_at, 'asc')
+        .select(({ todo }) => ({
+          id: todo.id,
+          text: todo.text
+        })),
+  })
 
   return <List items={ todos } />
 }
@@ -291,21 +304,22 @@ import { useLiveQuery } from '@tanstack/react-db'
 import { eq } from '@tanstack/db'
 
 const Todos = () => {
-  const { data: todos } = useLiveQuery((q) =>
-    q
-      .from({ todos: todoCollection })
-      .join(
-        { lists: listCollection },
-        ({ todos, lists }) => eq(lists.id, todos.listId),
-        'inner'
-      )
-      .where(({ lists }) => eq(lists.active, true))
-      .select(({ todos, lists }) => ({
-        id: todos.id,
-        title: todos.title,
-        listName: lists.name
-      }))
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todos: todoCollection })
+        .join(
+          { lists: listCollection },
+          ({ todos, lists }) => eq(lists.id, todos.listId),
+          'inner'
+        )
+        .where(({ lists }) => eq(lists.active, true))
+        .select(({ todos, lists }) => ({
+          id: todos.id,
+          title: todos.title,
+          listName: lists.name
+        })),
+  })
 
   return <List items={ todos } />
 }
@@ -321,11 +335,12 @@ import { Suspense } from 'react'
 
 const Todos = () => {
   // data is always defined - no need for optional chaining
-  const { data: todos } = useLiveSuspenseQuery((q) =>
-    q
-      .from({ todo: todoCollection })
-      .where(({ todo }) => eq(todo.completed, false))
-  )
+  const { data: todos } = useLiveSuspenseQuery({
+    query: (q) =>
+      q
+        .from({ todo: todoCollection })
+        .where(({ todo }) => eq(todo.completed, false)),
+  })
 
   return <List items={ todos } />
 }
@@ -397,13 +412,17 @@ The steps are to:
 2. implement mutation handlers that handle mutations by posting them to your API endpoints
 
 ```tsx
-import { useLiveQuery, createCollection } from "@tanstack/react-db"
+import {
+  collectionOptions,
+  useLiveQuery,
+} from "@tanstack/react-db"
 import { queryCollectionOptions } from "@tanstack/query-db-collection"
 
 // Load data into collections using TanStack Query.
 // It's common to define these in a `collections` module.
-const todoCollection = createCollection(
+const todoCollection = collectionOptions(
   queryCollectionOptions({
+    id: "todos",
     queryKey: ["todos"],
     queryFn: async () => fetch("/api/todos"),
     getKey: (item) => item.id,
@@ -417,8 +436,9 @@ const todoCollection = createCollection(
     // also add onUpdate, onDelete as needed.
   })
 )
-const listCollection = createCollection(
+const listCollection = collectionOptions(
   queryCollectionOptions({
+    id: "todo-lists",
     queryKey: ["todo-lists"],
     queryFn: async () => fetch("/api/todo-lists"),
     getKey: (item) => item.id,
@@ -436,22 +456,23 @@ const listCollection = createCollection(
 const Todos = () => {
   // Read the data using live queries. Here we show a live
   // query that joins across two collections.
-  const { data: todos } = useLiveQuery((q) =>
-    q
-      .from({ todo: todoCollection })
-      .join(
-        { list: listCollection },
-        ({ todo, list }) => eq(list.id, todo.list_id),
-        "inner"
-      )
-      .where(({ list }) => eq(list.active, true))
-      .select(({ todo, list }) => ({
-        id: todo.id,
-        text: todo.text,
-        status: todo.status,
-        listName: list.name,
-      }))
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: todoCollection })
+        .join(
+          { list: listCollection },
+          ({ todo, list }) => eq(list.id, todo.list_id),
+          "inner"
+        )
+        .where(({ list }) => eq(list.active, true))
+        .select(({ todo, list }) => ({
+          id: todo.id,
+          text: todo.text,
+          status: todo.status,
+          listName: list.name,
+        })),
+  })
 
   // ...
 }
@@ -476,15 +497,14 @@ This pattern enables the "load everything once" approach that makes apps like Li
 Here, we illustrate this pattern using [ElectricSQL](https://electric-sql.com) as the sync engine, but this pattern also works with other sync engines like [PowerSync](https://www.powersync.com/?utm_source=tanstack&utm_campaign=tanstack_partner), [RxDB](https://rxdb.info/), and [TrailBase](https://trailbase.io/).
 
 ```tsx
-import type { Collection } from "@tanstack/db"
 import type {
   MutationFn,
   PendingMutation,
-  createCollection,
 } from "@tanstack/react-db"
+import { collectionOptions, useDbClient } from "@tanstack/react-db"
 import { electricCollectionOptions } from "@tanstack/electric-db-collection"
 
-export const todoCollection = createCollection(
+export const todoCollection = collectionOptions(
   electricCollectionOptions({
     id: "todos",
     schema: todoSchema,
@@ -497,7 +517,6 @@ export const todoCollection = createCollection(
       },
     },
     getKey: (item) => item.id,
-    schema: todoSchema,
     onInsert: async ({ transaction }) => {
       const response = await api.todos.create(transaction.mutations[0].modified)
 
@@ -508,9 +527,11 @@ export const todoCollection = createCollection(
 )
 
 const AddTodo = () => {
+  const todosCollection = useDbClient().collection(todoCollection)
+
   return (
     <Button
-      onClick={() => todoCollection.insert({ text: "🔥 Make app faster" })}
+      onClick={() => todosCollection.insert({ text: "🔥 Make app faster" })}
     />
   )
 }
diff --git a/docs/quick-start.md b/docs/quick-start.md
index ea67999740..c25e9a11a4 100644
--- a/docs/quick-start.md
+++ b/docs/quick-start.md
@@ -10,13 +10,26 @@ TanStack DB is the reactive client-first store for your API. Stop building custo
 - **Mutate data** with instant optimistic updates
 
 ```tsx
-import { createCollection, eq, useLiveQuery } from '@tanstack/react-db'
+import {
+  DbClient,
+  DbProvider,
+  collectionOptions,
+  eq,
+  useDbClient,
+  useLiveQuery,
+} from '@tanstack/react-db'
+import { QueryClient } from '@tanstack/query-core'
 import { queryCollectionOptions } from '@tanstack/query-db-collection'
 
-// Define a collection that loads data using TanStack Query
-const todoCollection = createCollection(
+const queryClient = new QueryClient()
+const dbClient = new DbClient()
+
+// Define a stable collection descriptor that loads data using TanStack Query
+const todoCollection = collectionOptions(
   queryCollectionOptions({
+    id: 'todos',
     queryKey: ['todos'],
+    queryClient,
     queryFn: async () => {
       const response = await fetch('/api/todos')
       return response.json()
@@ -32,17 +45,24 @@ const todoCollection = createCollection(
   })
 )
 
+function useTodoCollection() {
+  return useDbClient().collection(todoCollection)
+}
+
 function Todos() {
+  const todosCollection = useTodoCollection()
+
   // Live query that updates automatically when data changes
-  const { data: todos } = useLiveQuery((q) =>
-    q.from({ todo: todoCollection })
-     .where(({ todo }) => eq(todo.completed, false))
-     .orderBy(({ todo }) => todo.createdAt, 'desc')
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q.from({ todo: todoCollection })
+       .where(({ todo }) => eq(todo.completed, false))
+       .orderBy(({ todo }) => todo.createdAt, 'desc'),
+  })
 
   const toggleTodo = (todo) => {
     // Instantly applies optimistic state, then syncs to server
-    todoCollection.update(todo.id, (draft) => {
+    todosCollection.update(todo.id, (draft) => {
       draft.completed = !draft.completed
     })
   }
@@ -57,6 +77,14 @@ function Todos() {
     </ul>
   )
 }
+
+function App() {
+  return (
+    <DbProvider client={dbClient}>
+      <Todos />
+    </DbProvider>
+  )
+}
 ```
 
 You now have collections, live queries, and optimistic mutations! Let's break this down further.
@@ -64,7 +92,7 @@ You now have collections, live queries, and optimistic mutations! Let's break th
 ## Installation
 
 ```bash
-npm install @tanstack/react-db @tanstack/query-db-collection
+npm install @tanstack/react-db @tanstack/query-db-collection @tanstack/query-core
 ```
 
 ## 1. Create a Collection
@@ -72,9 +100,11 @@ npm install @tanstack/react-db @tanstack/query-db-collection
 Collections store your data and handle persistence. The `queryCollectionOptions` loads data using TanStack Query and defines mutation handlers for server sync:
 
 ```tsx
-const todoCollection = createCollection(
+const todoCollection = collectionOptions(
   queryCollectionOptions({
+    id: 'todos',
     queryKey: ['todos'],
+    queryClient,
     queryFn: async () => {
       const response = await fetch('/api/todos')
       return response.json()
@@ -103,41 +133,55 @@ const todoCollection = createCollection(
 )
 ```
 
-## 2. Query with Live Queries
+## 2. Materialize the Collection
 
-Live queries reactively update when data changes. They support filtering, sorting, joins, and transformations:
+Use the `DbClient` from context to materialize the descriptor. A tiny collection hook keeps components from repeating the client lookup:
+
+```tsx
+function useTodoCollection() {
+  return useDbClient().collection(todoCollection)
+}
+```
+
+## 3. Query with Live Queries
+
+Live queries reactively update when data changes. They support filtering, sorting, joins, and transformations. React hooks derive query identity from the structured query by default, so normal builder queries do not need a separate `queryKey`:
 
 ```tsx
 function TodoList() {
   // Basic filtering and sorting
-  const { data: incompleteTodos } = useLiveQuery((q) =>
-    q.from({ todo: todoCollection })
-     .where(({ todo }) => eq(todo.completed, false))
-     .orderBy(({ todo }) => todo.createdAt, 'desc')
-  )
+  const { data: incompleteTodos } = useLiveQuery({
+    query: (q) =>
+      q.from({ todo: todoCollection })
+       .where(({ todo }) => eq(todo.completed, false))
+       .orderBy(({ todo }) => todo.createdAt, 'desc'),
+  })
 
   // Transform the data
-  const { data: todoSummary } = useLiveQuery((q) =>
-    q.from({ todo: todoCollection })
-     .select(({ todo }) => ({
-       id: todo.id,
-       summary: `${todo.text} (${todo.completed ? 'done' : 'pending'})`,
-       priority: todo.priority || 'normal'
-     }))
-  )
+  const { data: todoSummary } = useLiveQuery({
+    query: (q) =>
+      q.from({ todo: todoCollection })
+       .select(({ todo }) => ({
+         id: todo.id,
+         summary: `${todo.text} (${todo.completed ? 'done' : 'pending'})`,
+         priority: todo.priority || 'normal'
+       })),
+  })
 
   return <div>{/* Render todos */}</div>
 }
 ```
 
-## 3. Optimistic Mutations
+## 4. Optimistic Mutations
 
 Mutations apply instantly and sync to your server. If the server request fails, changes automatically roll back:
 
 ```tsx
 function TodoActions({ todo }) {
+  const todosCollection = useTodoCollection()
+
   const addTodo = () => {
-    todoCollection.insert({
+    todosCollection.insert({
       id: crypto.randomUUID(),
       text: 'New todo',
       completed: false,
@@ -146,19 +190,19 @@ function TodoActions({ todo }) {
   }
 
   const toggleComplete = () => {
-    todoCollection.update(todo.id, (draft) => {
+    todosCollection.update(todo.id, (draft) => {
       draft.completed = !draft.completed
     })
   }
 
   const updateText = (newText) => {
-    todoCollection.update(todo.id, (draft) => {
+    todosCollection.update(todo.id, (draft) => {
       draft.text = newText
     })
   }
 
   const deleteTodo = () => {
-    todoCollection.delete(todo.id)
+    todosCollection.delete(todo.id)
   }
 
   return (
diff --git a/docs/reference/functions/caseWhen.md b/docs/reference/functions/caseWhen.md
new file mode 100644
index 0000000000..be35c966df
--- /dev/null
+++ b/docs/reference/functions/caseWhen.md
@@ -0,0 +1,24 @@
+---
+id: caseWhen
+title: caseWhen
+---
+
+# Function: caseWhen()
+
+```ts
+function caseWhen(...args): any;
+```
+
+Defined in: [packages/db/src/query/builder/functions.ts:596](https://github.com/TanStack/db/blob/main/packages/db/src/query/builder/functions.ts#L596)
+
+Builds a structured conditional expression from condition/value pairs plus a final fallback value.
+
+## Parameters
+
+### args
+
+...`Array`\<`CaseWhenValue`\>
+
+## Returns
+
+`any`
diff --git a/examples/react-native/offline-transactions/src/components/TodoList.tsx b/examples/react-native/offline-transactions/src/components/TodoList.tsx
index f5aa666c2b..aaf3fe8d2c 100644
--- a/examples/react-native/offline-transactions/src/components/TodoList.tsx
+++ b/examples/react-native/offline-transactions/src/components/TodoList.tsx
@@ -30,9 +30,12 @@ export function TodoList({ collection, executor }: TodoListProps) {
     [executor, collection],
   )
 
-  const { data: todoList = [], isLoading } = useLiveQuery((q) =>
-    q.from({ todo: collection }).orderBy(({ todo }) => todo.createdAt, `desc`),
-  )
+  const { data: todoList = [], isLoading } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: collection })
+        .orderBy(({ todo }) => todo.createdAt, `desc`),
+  })
 
   // Monitor network status for UI display
   // (The executor's ReactNativeOnlineDetector handles sync retries internally)
diff --git a/examples/react-native/shopping-list/app/list/[id].tsx b/examples/react-native/shopping-list/app/list/[id].tsx
index 5e97589059..5d9d1f9c45 100644
--- a/examples/react-native/shopping-list/app/list/[id].tsx
+++ b/examples/react-native/shopping-list/app/list/[id].tsx
@@ -1,7 +1,6 @@
-import { useLocalSearchParams, Stack } from 'expo-router'
+import { Stack, useLocalSearchParams } from 'expo-router'
 import { SafeAreaView } from 'react-native-safe-area-context'
-import { useLiveQuery } from '@tanstack/react-db'
-import { eq } from '@tanstack/react-db'
+import { eq, useLiveQuery } from '@tanstack/react-db'
 import { listsCollection } from '../../src/db/collections'
 import { ListDetail } from '../../src/components/ListDetail'
 
@@ -9,15 +8,14 @@ export default function ListScreen() {
   const { id } = useLocalSearchParams<{ id: string }>() as { id: string }
 
   // Get the list name for the header
-  const listResult = useLiveQuery((q) =>
-    q
-      .from({ list: listsCollection })
-      .where(({ list }) => eq(list.id, id))
-      .select(({ list }) => ({ id: list.id, name: list.name })),
-  )
-  const list = (listResult.data ?? [])[0] as
-    | { id: string; name: string }
-    | undefined
+  const listResult = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ list: listsCollection })
+        .where(({ list }) => eq(list.id, id))
+        .select(({ list }) => ({ id: list.id, name: list.name })),
+  })
+  const list = listResult.data[0] as { id: string; name: string } | undefined
 
   return (
     <>
diff --git a/examples/react-native/shopping-list/src/components/ListDetail.tsx b/examples/react-native/shopping-list/src/components/ListDetail.tsx
index 6bcd31788b..2b3e300e3a 100644
--- a/examples/react-native/shopping-list/src/components/ListDetail.tsx
+++ b/examples/react-native/shopping-list/src/components/ListDetail.tsx
@@ -82,12 +82,13 @@ export function ListDetail({ listId }: ListDetailProps) {
   const { itemActions } = useShopping()
 
   // Get items for this list
-  const itemsResult = useLiveQuery((q) =>
-    q
-      .from({ item: itemsCollection })
-      .where(({ item }) => eq(item.listId, listId))
-      .orderBy(({ item }) => item.createdAt, `asc`),
-  )
+  const itemsResult = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ item: itemsCollection })
+        .where(({ item }) => eq(item.listId, listId))
+        .orderBy(({ item }) => item.createdAt, `asc`),
+  })
   const items = itemsResult.data as Array<ListItemRow>
 
   const handleAddItem = async () => {
diff --git a/examples/react-native/shopping-list/src/components/ListsScreen.tsx b/examples/react-native/shopping-list/src/components/ListsScreen.tsx
index 1a5b501c3d..d46b277644 100644
--- a/examples/react-native/shopping-list/src/components/ListsScreen.tsx
+++ b/examples/react-native/shopping-list/src/components/ListsScreen.tsx
@@ -107,37 +107,38 @@ export function ListsScreen() {
 
   // ★ Includes query with aggregate subqueries: each list gets child collections
   // with computed counts. ListCard subscribes to them via useLiveQuery.
-  const queryResult = useLiveQuery((q) =>
-    q
-      .from({ list: listsCollection })
-      .select(({ list }) => ({
-        id: list.id,
-        name: list.name,
-        createdAt: list.createdAt,
-        $synced: list.$synced,
-        totalItems: q
-          .from({ item: itemsCollection })
-          .where(({ item }) => eq(item.listId, list.id))
-          .select(({ item }) => ({ n: count(item.id) })),
-        uncheckedPreview: q
-          .from({ item: itemsCollection })
-          .where(({ item }) => eq(item.listId, list.id))
-          .where(({ item }) => eq(item.checked, false))
-          .select(({ item }) => ({
-            id: item.id,
-            text: item.text,
-            createdAt: item.createdAt,
-          }))
-          .orderBy(({ item }) => item.createdAt, `asc`)
-          .limit(3),
-        checkedItems: q
-          .from({ item: itemsCollection })
-          .where(({ item }) => eq(item.listId, list.id))
-          .where(({ item }) => eq(item.checked, true))
-          .select(({ item }) => ({ n: count(item.id) })),
-      }))
-      .orderBy(({ list }) => list.createdAt, `desc`),
-  )
+  const queryResult = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ list: listsCollection })
+        .select(({ list }) => ({
+          id: list.id,
+          name: list.name,
+          createdAt: list.createdAt,
+          $synced: list.$synced,
+          totalItems: q
+            .from({ item: itemsCollection })
+            .where(({ item }) => eq(item.listId, list.id))
+            .select(({ item }) => ({ n: count(item.id) })),
+          uncheckedPreview: q
+            .from({ item: itemsCollection })
+            .where(({ item }) => eq(item.listId, list.id))
+            .where(({ item }) => eq(item.checked, false))
+            .select(({ item }) => ({
+              id: item.id,
+              text: item.text,
+              createdAt: item.createdAt,
+            }))
+            .orderBy(({ item }) => item.createdAt, `asc`)
+            .limit(3),
+          checkedItems: q
+            .from({ item: itemsCollection })
+            .where(({ item }) => eq(item.listId, list.id))
+            .where(({ item }) => eq(item.checked, true))
+            .select(({ item }) => ({ n: count(item.id) })),
+        }))
+        .orderBy(({ list }) => list.createdAt, `desc`),
+  })
   const lists = queryResult.data as unknown as Array<{
     id: string
     name: string
diff --git a/examples/react/offline-transactions/src/components/PersistedTodoDemo.tsx b/examples/react/offline-transactions/src/components/PersistedTodoDemo.tsx
index e7252f5f4e..c7f25cd99c 100644
--- a/examples/react/offline-transactions/src/components/PersistedTodoDemo.tsx
+++ b/examples/react/offline-transactions/src/components/PersistedTodoDemo.tsx
@@ -11,9 +11,12 @@ export function PersistedTodoDemo({ collection }: PersistedTodoDemoProps) {
   const [newTodoText, setNewTodoText] = useState(``)
   const [error, setError] = useState<string | null>(null)
 
-  const { data: todoList = [] } = useLiveQuery((q) =>
-    q.from({ todo: collection }).orderBy(({ todo }) => todo.createdAt, `desc`),
-  )
+  const { data: todoList = [] } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: collection })
+        .orderBy(({ todo }) => todo.createdAt, `desc`),
+  })
 
   const handleAddTodo = () => {
     if (!newTodoText.trim()) return
diff --git a/examples/react/offline-transactions/src/components/TodoDemo.tsx b/examples/react/offline-transactions/src/components/TodoDemo.tsx
index fcdf088da1..4f95b79a92 100644
--- a/examples/react/offline-transactions/src/components/TodoDemo.tsx
+++ b/examples/react/offline-transactions/src/components/TodoDemo.tsx
@@ -25,11 +25,12 @@ export function TodoDemo({
   console.log({ offline, actions })
 
   // Use live query to get todos
-  const { data: todoList = [], isLoading } = useLiveQuery((q) =>
-    q
-      .from({ todo: todoCollection })
-      .orderBy(({ todo }) => todo.createdAt, `desc`),
-  )
+  const { data: todoList = [], isLoading } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: todoCollection })
+        .orderBy(({ todo }) => todo.createdAt, `desc`),
+  })
 
   // Monitor online status
   useEffect(() => {
diff --git a/examples/react/projects/src/routes/_authenticated.tsx b/examples/react/projects/src/routes/_authenticated.tsx
index 17ed734276..43142ee5ca 100644
--- a/examples/react/projects/src/routes/_authenticated.tsx
+++ b/examples/react/projects/src/routes/_authenticated.tsx
@@ -20,7 +20,9 @@ function AuthenticatedLayout() {
   const [showNewProjectForm, setShowNewProjectForm] = useState(false)
   const [newProjectName, setNewProjectName] = useState(``)
 
-  const { data: projects } = useLiveQuery((q) => q.from({ projectCollection }))
+  const { data: projects } = useLiveQuery({
+    query: (q) => q.from({ projectCollection }),
+  })
 
   const handleLogout = async () => {
     await authClient.signOut()
diff --git a/examples/react/projects/src/routes/_authenticated/project/$projectId.tsx b/examples/react/projects/src/routes/_authenticated/project/$projectId.tsx
index 0ac0be409e..a60c4848d3 100644
--- a/examples/react/projects/src/routes/_authenticated/project/$projectId.tsx
+++ b/examples/react/projects/src/routes/_authenticated/project/$projectId.tsx
@@ -25,41 +25,40 @@ export const Route = createFileRoute(`/_authenticated/project/$projectId`)({
 
 function ProjectPage() {
   const { projectId } = Route.useParams()
+  const projectIdNumber = parseInt(projectId, 10)
   const { data: session } = authClient.useSession()
   const [newTodoText, setNewTodoText] = useState(``)
 
-  const { data: todos } = useLiveQuery(
-    (q) =>
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
       q
         .from({ todo: todoCollection })
-        .where(({ todo }) => eq(todo.project_id, parseInt(projectId, 10)))
+        .where(({ todo }) => eq(todo.project_id, projectIdNumber))
         .orderBy(({ todo }) => todo.created_at),
-    [projectId]
-  )
-
-  const { data: users } = useLiveQuery((q) =>
-    q.from({ users: usersCollection })
-  )
-  const { data: usersInProjects } = useLiveQuery(
-    (q) =>
+  })
+
+  const { data: users } = useLiveQuery({
+    query: (q) => q.from({ users: usersCollection }),
+  })
+  const { data: usersInProjects } = useLiveQuery({
+    queryKey: [projectCollection.id, `users-in-project`, projectIdNumber],
+    query: (q) =>
       q
         .from({ projects: projectCollection })
-        .where(({ projects }) => eq(projects.id, parseInt(projectId, 10)))
+        .where(({ projects }) => eq(projects.id, projectIdNumber))
         .fn.select(({ projects }) => ({
           users: projects.shared_user_ids.concat(projects.owner_id),
           owner: projects.owner_id,
         })),
-    [projectId]
-  )
+  })
   const usersInProject = usersInProjects[0]
 
-  const { data: projects } = useLiveQuery(
-    (q) =>
+  const { data: projects } = useLiveQuery({
+    query: (q) =>
       q
         .from({ p: projectCollection })
-        .where(({ p }) => eq(p.id, parseInt(projectId, 10))),
-    [projectId]
-  )
+        .where(({ p }) => eq(p.id, projectIdNumber)),
+  })
   const project = projects[0]
 
   const addTodo = () => {
@@ -69,7 +68,7 @@ function ProjectPage() {
         id: Math.floor(Math.random() * 100000),
         text: newTodoText.trim(),
         completed: false,
-        project_id: parseInt(projectId),
+        project_id: projectIdNumber,
         user_ids: [],
         created_at: new Date(),
       })
diff --git a/examples/react/start-ssr-e2e/e2e/ssr-db.spec.ts b/examples/react/start-ssr-e2e/e2e/ssr-db.spec.ts
new file mode 100644
index 0000000000..35a89a0904
--- /dev/null
+++ b/examples/react/start-ssr-e2e/e2e/ssr-db.spec.ts
@@ -0,0 +1,49 @@
+import { expect, test } from '@playwright/test'
+
+test(`TanStack Start hydrates DB collection rows and applies streamed chunks`, async ({
+  page,
+  request,
+}) => {
+  const response = await request.get(`/ssr-db`)
+  expect(response.ok()).toBe(true)
+
+  const html = await response.text()
+  expect(html).toContain(`Pay invoices`)
+  expect(html).toContain(`Review pull requests`)
+  expect(html).toContain(`ssr`)
+  expect(html).not.toContain(`Streamed from collection chunk`)
+
+  const browserErrors: Array<string> = []
+  page.on(`console`, (message) => {
+    if (message.type() === `error`) {
+      browserErrors.push(message.text())
+    }
+  })
+  page.on(`pageerror`, (error) => {
+    browserErrors.push(error.message)
+  })
+
+  await page.goto(`/ssr-db`)
+
+  await expect(page.getByTestId(`hydration-state`)).toHaveText(`hydrated`)
+  await expect(page.getByTestId(`ready-state`)).toHaveText(`ready`)
+  await expect(page.getByTestId(`streamed-status`)).toHaveText(`waiting`)
+  await expect(page.getByTestId(`ssr-row-count`)).toHaveText(`2`)
+  await expect(page.getByTestId(`ssr-todo-list`)).toContainText(`Pay invoices`)
+  await expect(page.getByTestId(`ssr-todo-list`)).toContainText(
+    `Review pull requests`,
+  )
+  await expect(page.getByTestId(`ssr-todo-list`)).not.toContainText(
+    `Archived roadmap`,
+  )
+
+  await page.getByTestId(`apply-stream-chunk`).click()
+
+  await expect(page.getByTestId(`streamed-status`)).toHaveText(`streamed`)
+  await expect(page.getByTestId(`ssr-row-count`)).toHaveText(`3`)
+  await expect(page.getByTestId(`ssr-todo-streamed-1`)).toBeVisible()
+  await expect(page.getByTestId(`ssr-todo-streamed-1`)).toContainText(
+    `Streamed from collection chunk`,
+  )
+  expect(browserErrors).toEqual([])
+})
diff --git a/examples/react/start-ssr-e2e/package.json b/examples/react/start-ssr-e2e/package.json
new file mode 100644
index 0000000000..9aff9845d5
--- /dev/null
+++ b/examples/react/start-ssr-e2e/package.json
@@ -0,0 +1,28 @@
+{
+  "name": "@tanstack/db-example-react-start-ssr-e2e",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite dev",
+    "test:e2e": "pnpm --filter @tanstack/db build && pnpm --filter @tanstack/react-db build && playwright test"
+  },
+  "dependencies": {
+    "@tanstack/react-db": "^0.1.85",
+    "@tanstack/react-router": "^1.159.5",
+    "@tanstack/react-start": "^1.159.5",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "vite-tsconfig-paths": "^5.1.4"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.60.0",
+    "@types/node": "^25.2.2",
+    "@types/react": "^19.2.13",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.3",
+    "typescript": "^5.9.2",
+    "vite": "^7.3.0"
+  }
+}
diff --git a/examples/react/start-ssr-e2e/playwright.config.ts b/examples/react/start-ssr-e2e/playwright.config.ts
new file mode 100644
index 0000000000..75560ef39c
--- /dev/null
+++ b/examples/react/start-ssr-e2e/playwright.config.ts
@@ -0,0 +1,26 @@
+import { defineConfig, devices } from '@playwright/test'
+
+export default defineConfig({
+  testDir: `./e2e`,
+  timeout: 30000,
+  expect: {
+    timeout: 10000,
+  },
+  fullyParallel: false,
+  use: {
+    baseURL: `http://127.0.0.1:4175`,
+    trace: `on-first-retry`,
+  },
+  webServer: {
+    command: `pnpm dev --host 127.0.0.1 --port 4175`,
+    reuseExistingServer: !process.env.CI,
+    timeout: 120000,
+    url: `http://127.0.0.1:4175`,
+  },
+  projects: [
+    {
+      name: `chromium`,
+      use: { ...devices[`Desktop Chrome`] },
+    },
+  ],
+})
diff --git a/examples/react/start-ssr-e2e/src/lib/ssr-fixture.ts b/examples/react/start-ssr-e2e/src/lib/ssr-fixture.ts
new file mode 100644
index 0000000000..344f9de182
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/lib/ssr-fixture.ts
@@ -0,0 +1,93 @@
+import {
+  DbClient,
+  collectionOptions,
+  createLiveQueryCollection,
+  eq,
+} from '@tanstack/react-db'
+import type { DehydratedDbState } from '@tanstack/react-db'
+
+export type SsrTodo = {
+  id: string
+  text: string
+  status: `open` | `done`
+  source: `server` | `stream`
+}
+
+export const ssrTodoCollectionId = `ssr-e2e-todos`
+
+const serverTodos: Array<SsrTodo> = [
+  {
+    id: `server-1`,
+    text: `Pay invoices`,
+    status: `open`,
+    source: `server`,
+  },
+  {
+    id: `server-2`,
+    text: `Review pull requests`,
+    status: `open`,
+    source: `server`,
+  },
+  {
+    id: `server-3`,
+    text: `Archived roadmap`,
+    status: `done`,
+    source: `server`,
+  },
+]
+
+export const streamedTodo: SsrTodo = {
+  id: `streamed-1`,
+  text: `Streamed from collection chunk`,
+  status: `open`,
+  source: `stream`,
+}
+
+export const ssrTodoCollection = collectionOptions<SsrTodo, string>({
+  id: ssrTodoCollectionId,
+  getKey: (todo) => todo.id,
+  syncMode: `on-demand`,
+  sync: {
+    sync: ({ begin, write, commit, markReady }) => {
+      markReady()
+
+      return {
+        loadSubset: () => {
+          begin({ immediate: true })
+          for (const todo of serverTodos) {
+            write({
+              type: `insert`,
+              value: todo,
+            })
+          }
+          commit()
+          return true
+        },
+      }
+    },
+  },
+})
+
+export async function createDehydratedSsrTodoState(): Promise<DehydratedDbState> {
+  const dbClient = new DbClient()
+  const todos = dbClient.collection(ssrTodoCollection)
+  const openTodos = createLiveQueryCollection((q) =>
+    q.from({ todo: todos }).where(({ todo }) => eq(todo.status, `open`)),
+  )
+
+  await openTodos.preload()
+
+  return dbClient.dehydrate()
+}
+
+export function applyStreamedTodo(dbClient: DbClient): void {
+  dbClient.applyCollectionChunk({
+    collectionId: ssrTodoCollectionId,
+    rows: [
+      {
+        key: streamedTodo.id,
+        value: streamedTodo,
+      },
+    ],
+  })
+}
diff --git a/examples/react/start-ssr-e2e/src/main.tsx b/examples/react/start-ssr-e2e/src/main.tsx
new file mode 100644
index 0000000000..7c9866dcd3
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/main.tsx
@@ -0,0 +1,12 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import { RouterProvider } from '@tanstack/react-router'
+import { getRouter } from './router'
+
+const router = getRouter()
+
+createRoot(document.getElementById(`root`)!).render(
+  <StrictMode>
+    <RouterProvider router={router} />
+  </StrictMode>,
+)
diff --git a/examples/react/start-ssr-e2e/src/routeTree.gen.ts b/examples/react/start-ssr-e2e/src/routeTree.gen.ts
new file mode 100644
index 0000000000..9760a1c05e
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/routeTree.gen.ts
@@ -0,0 +1,87 @@
+/* eslint-disable */
+
+// @ts-nocheck
+
+// noinspection JSUnusedGlobalSymbols
+
+// This file was automatically generated by TanStack Router.
+// You should NOT make any changes in this file as it will be overwritten.
+// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
+
+import { Route as rootRouteImport } from './routes/__root'
+import { Route as SsrDbRouteImport } from './routes/ssr-db'
+import { Route as IndexRouteImport } from './routes/index'
+
+const SsrDbRoute = SsrDbRouteImport.update({
+  id: '/ssr-db',
+  path: '/ssr-db',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const IndexRoute = IndexRouteImport.update({
+  id: '/',
+  path: '/',
+  getParentRoute: () => rootRouteImport,
+} as any)
+
+export interface FileRoutesByFullPath {
+  '/': typeof IndexRoute
+  '/ssr-db': typeof SsrDbRoute
+}
+export interface FileRoutesByTo {
+  '/': typeof IndexRoute
+  '/ssr-db': typeof SsrDbRoute
+}
+export interface FileRoutesById {
+  __root__: typeof rootRouteImport
+  '/': typeof IndexRoute
+  '/ssr-db': typeof SsrDbRoute
+}
+export interface FileRouteTypes {
+  fileRoutesByFullPath: FileRoutesByFullPath
+  fullPaths: '/' | '/ssr-db'
+  fileRoutesByTo: FileRoutesByTo
+  to: '/' | '/ssr-db'
+  id: '__root__' | '/' | '/ssr-db'
+  fileRoutesById: FileRoutesById
+}
+export interface RootRouteChildren {
+  IndexRoute: typeof IndexRoute
+  SsrDbRoute: typeof SsrDbRoute
+}
+
+declare module '@tanstack/react-router' {
+  interface FileRoutesByPath {
+    '/ssr-db': {
+      id: '/ssr-db'
+      path: '/ssr-db'
+      fullPath: '/ssr-db'
+      preLoaderRoute: typeof SsrDbRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/': {
+      id: '/'
+      path: '/'
+      fullPath: '/'
+      preLoaderRoute: typeof IndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+  }
+}
+
+const rootRouteChildren: RootRouteChildren = {
+  IndexRoute: IndexRoute,
+  SsrDbRoute: SsrDbRoute,
+}
+export const routeTree = rootRouteImport
+  ._addFileChildren(rootRouteChildren)
+  ._addFileTypes<FileRouteTypes>()
+
+import type { getRouter } from './router.tsx'
+import type { startInstance } from './start.tsx'
+declare module '@tanstack/react-start' {
+  interface Register {
+    ssr: true
+    router: Awaited<ReturnType<typeof getRouter>>
+    config: Awaited<ReturnType<typeof startInstance.getOptions>>
+  }
+}
diff --git a/examples/react/start-ssr-e2e/src/router.tsx b/examples/react/start-ssr-e2e/src/router.tsx
new file mode 100644
index 0000000000..923234f94f
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/router.tsx
@@ -0,0 +1,10 @@
+import { createRouter as createTanstackRouter } from '@tanstack/react-router'
+import { routeTree } from './routeTree.gen'
+import './styles.css'
+
+export function getRouter() {
+  return createTanstackRouter({
+    routeTree,
+    scrollRestoration: true,
+  })
+}
diff --git a/examples/react/start-ssr-e2e/src/routes/__root.tsx b/examples/react/start-ssr-e2e/src/routes/__root.tsx
new file mode 100644
index 0000000000..399d4cc20a
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/routes/__root.tsx
@@ -0,0 +1,47 @@
+import * as React from 'react'
+import {
+  HeadContent,
+  Outlet,
+  Scripts,
+  createRootRoute,
+} from '@tanstack/react-router'
+import appCss from '../styles.css?url'
+
+export const Route = createRootRoute({
+  head: () => ({
+    meta: [
+      {
+        charSet: `utf-8`,
+      },
+      {
+        name: `viewport`,
+        content: `width=device-width, initial-scale=1`,
+      },
+      {
+        title: `TanStack DB Start SSR E2E`,
+      },
+    ],
+    links: [
+      {
+        rel: `stylesheet`,
+        href: appCss,
+      },
+    ],
+  }),
+  shellComponent: RootDocument,
+  component: () => <Outlet />,
+})
+
+function RootDocument({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en">
+      <head>
+        <HeadContent />
+      </head>
+      <body>
+        {children}
+        <Scripts />
+      </body>
+    </html>
+  )
+}
diff --git a/examples/react/start-ssr-e2e/src/routes/index.tsx b/examples/react/start-ssr-e2e/src/routes/index.tsx
new file mode 100644
index 0000000000..1131099207
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/routes/index.tsx
@@ -0,0 +1,14 @@
+import { Link, createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute(`/`)({
+  component: HomePage,
+})
+
+function HomePage() {
+  return (
+    <main style={{ padding: 32 }}>
+      <h1>TanStack DB Start SSR E2E</h1>
+      <Link to="/ssr-db">Open SSR DB route</Link>
+    </main>
+  )
+}
diff --git a/examples/react/start-ssr-e2e/src/routes/ssr-db.tsx b/examples/react/start-ssr-e2e/src/routes/ssr-db.tsx
new file mode 100644
index 0000000000..07e23f6214
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/routes/ssr-db.tsx
@@ -0,0 +1,113 @@
+import * as React from 'react'
+import { createFileRoute } from '@tanstack/react-router'
+import { DbClient, DbProvider, eq, useLiveQuery } from '@tanstack/react-db'
+import {
+  applyStreamedTodo,
+  createDehydratedSsrTodoState,
+  ssrTodoCollection,
+} from '../lib/ssr-fixture'
+
+export const Route = createFileRoute(`/ssr-db`)({
+  loader: async () => {
+    return {
+      dbState: await createDehydratedSsrTodoState(),
+    }
+  },
+  component: SsrDbRoute,
+})
+
+function SsrDbRoute() {
+  const { dbState } = Route.useLoaderData()
+  const [dbClient] = React.useState(() => {
+    const client = new DbClient()
+    client.hydrate(dbState)
+    return client
+  })
+
+  return (
+    <DbProvider client={dbClient}>
+      <SsrDbTodos dbClient={dbClient} />
+    </DbProvider>
+  )
+}
+
+function SsrDbTodos({ dbClient }: { dbClient: DbClient }) {
+  const [hydrated, setHydrated] = React.useState(false)
+  const [streamed, setStreamed] = React.useState(false)
+  const { data: todos, isReady } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: ssrTodoCollection })
+        .where(({ todo }) => eq(todo.status, `open`))
+        .orderBy(({ todo }) => todo.id, `asc`),
+  })
+
+  React.useEffect(() => {
+    setHydrated(true)
+  }, [])
+
+  return (
+    <main
+      data-testid="ssr-db-page"
+      style={{
+        background: `#f8fafc`,
+        minHeight: `100vh`,
+        padding: 32,
+      }}
+    >
+      <section
+        style={{
+          background: `white`,
+          border: `1px solid #e5e7eb`,
+          borderRadius: 8,
+          margin: `0 auto`,
+          maxWidth: 720,
+          padding: 24,
+        }}
+      >
+        <h1>TanStack DB SSR</h1>
+
+        <div style={{ display: `flex`, gap: 16, marginBottom: 16 }}>
+          <span data-testid="hydration-state">
+            {hydrated ? `hydrated` : `ssr`}
+          </span>
+          <span data-testid="ready-state">{isReady ? `ready` : `loading`}</span>
+          <span data-testid="streamed-status">
+            {streamed ? `streamed` : `waiting`}
+          </span>
+          <span>
+            rows: <strong data-testid="ssr-row-count">{todos.length}</strong>
+          </span>
+        </div>
+
+        <ul data-testid="ssr-todo-list">
+          {todos.map((todo) => (
+            <li data-testid={`ssr-todo-${todo.id}`} key={todo.id}>
+              {todo.text} <small>({todo.source})</small>
+            </li>
+          ))}
+        </ul>
+
+        <button
+          data-testid="apply-stream-chunk"
+          onClick={() => {
+            applyStreamedTodo(dbClient)
+            setStreamed(true)
+          }}
+          style={{
+            background: `#15803d`,
+            border: 0,
+            borderRadius: 6,
+            color: `white`,
+            cursor: `pointer`,
+            marginTop: 16,
+            padding: `10px 14px`,
+          }}
+          type="button"
+        >
+          Apply streamed chunk
+        </button>
+      </section>
+    </main>
+  )
+}
diff --git a/examples/react/start-ssr-e2e/src/start.tsx b/examples/react/start-ssr-e2e/src/start.tsx
new file mode 100644
index 0000000000..bb197cafb1
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/start.tsx
@@ -0,0 +1,7 @@
+import { createStart } from '@tanstack/react-start'
+
+export const startInstance = createStart(() => {
+  return {
+    defaultSsr: true,
+  }
+})
diff --git a/examples/react/start-ssr-e2e/src/styles.css b/examples/react/start-ssr-e2e/src/styles.css
new file mode 100644
index 0000000000..251e05865f
--- /dev/null
+++ b/examples/react/start-ssr-e2e/src/styles.css
@@ -0,0 +1,15 @@
+body {
+  margin: 0;
+  font-family:
+    Inter,
+    ui-sans-serif,
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    sans-serif;
+}
+
+button {
+  font: inherit;
+}
diff --git a/examples/react/start-ssr-e2e/tsconfig.json b/examples/react/start-ssr-e2e/tsconfig.json
new file mode 100644
index 0000000000..19dcb2d948
--- /dev/null
+++ b/examples/react/start-ssr-e2e/tsconfig.json
@@ -0,0 +1,20 @@
+{
+  "extends": "../../../tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "module": "ES2022",
+    "moduleResolution": "bundler",
+    "jsx": "react-jsx",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": [
+    "e2e/**/*.ts",
+    "playwright.config.ts",
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "vite.config.ts"
+  ],
+  "exclude": ["dist", "node_modules"]
+}
diff --git a/examples/react/start-ssr-e2e/vite.config.ts b/examples/react/start-ssr-e2e/vite.config.ts
new file mode 100644
index 0000000000..856428d501
--- /dev/null
+++ b/examples/react/start-ssr-e2e/vite.config.ts
@@ -0,0 +1,17 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+import { tanstackStart } from '@tanstack/react-start/plugin/vite'
+import viteTsConfigPaths from 'vite-tsconfig-paths'
+
+export default defineConfig({
+  plugins: [
+    viteTsConfigPaths({
+      projects: [`./tsconfig.json`],
+    }),
+    tanstackStart({
+      srcDirectory: `src`,
+      start: { entry: `./start.tsx` },
+    }),
+    react(),
+  ],
+})
diff --git a/examples/react/todo/src/routes/electric.tsx b/examples/react/todo/src/routes/electric.tsx
index 61629b81f2..16da41b9ff 100644
--- a/examples/react/todo/src/routes/electric.tsx
+++ b/examples/react/todo/src/routes/electric.tsx
@@ -24,15 +24,16 @@ export const Route = createFileRoute(`/electric`)({
 
 function ElectricPage() {
   // Get data using live queries with Electric collections
-  const { data: todos } = useLiveQuery((q) =>
-    q
-      .from({ todo: electricTodoCollection })
-      .orderBy(({ todo }) => todo.created_at, `asc`),
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: electricTodoCollection })
+        .orderBy(({ todo }) => todo.created_at, `asc`),
+  })
 
-  const { data: configData } = useLiveQuery((q) =>
-    q.from({ config: electricConfigCollection }),
-  )
+  const { data: configData } = useLiveQuery({
+    query: (q) => q.from({ config: electricConfigCollection }),
+  })
 
   // Electric collections use txid to track sync
   const configMutationFn = async ({
diff --git a/examples/react/todo/src/routes/query.tsx b/examples/react/todo/src/routes/query.tsx
index 62c0ad37dc..5cbf4f28de 100644
--- a/examples/react/todo/src/routes/query.tsx
+++ b/examples/react/todo/src/routes/query.tsx
@@ -21,15 +21,16 @@ export const Route = createFileRoute(`/query`)({
 
 function QueryPage() {
   // Get data using live queries with Query collections
-  const { data: todos } = useLiveQuery((q) =>
-    q
-      .from({ todo: queryTodoCollection })
-      .orderBy(({ todo }) => todo.created_at, `asc`),
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: queryTodoCollection })
+        .orderBy(({ todo }) => todo.created_at, `asc`),
+  })
 
-  const { data: configData } = useLiveQuery((q) =>
-    q.from({ config: queryConfigCollection }),
-  )
+  const { data: configData } = useLiveQuery({
+    query: (q) => q.from({ config: queryConfigCollection }),
+  })
 
   // Query collections automatically refetch after handler completes
   const configMutationFn = async ({
diff --git a/examples/react/todo/src/routes/trailbase.tsx b/examples/react/todo/src/routes/trailbase.tsx
index 96e05e11ac..d4b5b46556 100644
--- a/examples/react/todo/src/routes/trailbase.tsx
+++ b/examples/react/todo/src/routes/trailbase.tsx
@@ -22,15 +22,16 @@ export const Route = createFileRoute(`/trailbase`)({
 
 function TrailBasePage() {
   // Get data using live queries with TrailBase collections
-  const { data: todos } = useLiveQuery((q) =>
-    q
-      .from({ todo: trailBaseTodoCollection })
-      .orderBy(({ todo }) => todo.created_at, `asc`),
-  )
+  const { data: todos } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: trailBaseTodoCollection })
+        .orderBy(({ todo }) => todo.created_at, `asc`),
+  })
 
-  const { data: configData } = useLiveQuery((q) =>
-    q.from({ config: trailBaseConfigCollection }),
-  )
+  const { data: configData } = useLiveQuery({
+    query: (q) => q.from({ config: trailBaseConfigCollection }),
+  })
 
   // Note: TrailBase collections use recordApi internally, which is not exposed
   // as a collection utility. For this example, we're not using serialized
diff --git a/packages/db/skills/db-core/live-queries/SKILL.md b/packages/db/skills/db-core/live-queries/SKILL.md
index fe55967ca9..b07dd45076 100644
--- a/packages/db/skills/db-core/live-queries/SKILL.md
+++ b/packages/db/skills/db-core/live-queries/SKILL.md
@@ -372,15 +372,18 @@ JS `.filter()` / `.map()` on the result array throws away incremental maintenanc
 
 ```ts
 // WRONG -- re-runs filter on every change
-const { data } = useLiveQuery((q) => q.from({ todos: todosCollection }))
+const { data } = useLiveQuery({
+  query: (q) => q.from({ todos: todosCollection }),
+})
 const active = data.filter((t) => t.completed === false)
 
 // CORRECT -- incrementally maintained
-const { data } = useLiveQuery((q) =>
-  q
-    .from({ todos: todosCollection })
-    .where(({ todos }) => eq(todos.completed, false)),
-)
+const { data } = useLiveQuery({
+  query: (q) =>
+    q
+      .from({ todos: todosCollection })
+      .where(({ todos }) => eq(todos.completed, false)),
+})
 ```
 
 ### HIGH: Not using the full operator set
diff --git a/packages/db/skills/meta-framework/SKILL.md b/packages/db/skills/meta-framework/SKILL.md
index 04046f6896..08c2c7d088 100644
--- a/packages/db/skills/meta-framework/SKILL.md
+++ b/packages/db/skills/meta-framework/SKILL.md
@@ -62,7 +62,9 @@ export const Route = createFileRoute('/todos')({
 })
 
 function TodoPage() {
-  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))
+  const { data: todos } = useLiveQuery({
+    query: (q) => q.from({ todo: todoCollection }),
+  })
   return (
     <ul>
       {todos.map((t) => (
@@ -98,9 +100,9 @@ import { useEffect, useState } from 'react'
 import { useLiveQuery } from '@tanstack/react-db'
 
 export default function TodoPage() {
-  const { data: todos, isLoading } = useLiveQuery((q) =>
-    q.from({ todo: todoCollection }),
-  )
+  const { data: todos, isLoading } = useLiveQuery({
+    query: (q) => q.from({ todo: todoCollection }),
+  })
 
   if (isLoading) return <div>Loading...</div>
   return (
@@ -128,7 +130,9 @@ import { useLiveQuery } from '@tanstack/react-db'
 const preloadPromise = todoCollection.preload()
 
 export default function TodoPage() {
-  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))
+  const { data: todos } = useLiveQuery({
+    query: (q) => q.from({ todo: todoCollection }),
+  })
   return (
     <ul>
       {todos.map((t) => (
@@ -157,7 +161,9 @@ export const clientLoader = async ({ request }: ClientLoaderFunctionArgs) => {
 export const loader = () => null
 
 export default function TodoPage() {
-  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))
+  const { data: todos } = useLiveQuery({
+    query: (q) => q.from({ todo: todoCollection }),
+  })
   return (
     <ul>
       {todos.map((t) => (
@@ -260,7 +266,9 @@ export const Route = createFileRoute('/todos')({
     return null
   },
   component: () => {
-    const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }))
+    const { data } = useLiveQuery({
+      query: (q) => q.from({ todo: todoCollection }),
+    })
     // ...
   },
 })
@@ -342,7 +350,9 @@ export const Route = createFileRoute('/todos')({
   ssr: false,
   loader: async () => { await todoCollection.preload() },
   component: () => {
-    const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }))
+    const { data } = useLiveQuery({
+      query: (q) => q.from({ todo: todoCollection }),
+    })
   },
 })
 ```
diff --git a/packages/db/src/client.ts b/packages/db/src/client.ts
new file mode 100644
index 0000000000..ae4da3a83c
--- /dev/null
+++ b/packages/db/src/client.ts
@@ -0,0 +1,294 @@
+import { createCollection } from './collection/index.js'
+import type { StandardSchemaV1 } from '@standard-schema/spec'
+import type { Collection } from './collection/index.js'
+import type {
+  CollectionConfig,
+  InferSchemaInput,
+  InferSchemaOutput,
+  NonSingleResult,
+  SingleResult,
+  UtilsRecord,
+} from './types.js'
+
+const collectionOptionsBrand: unique symbol = Symbol.for(
+  `@tanstack/db.collectionOptions`,
+) as never
+
+export type CollectionOptions<
+  T extends object = Record<string, unknown>,
+  TKey extends string | number = string | number,
+  TSchema extends StandardSchemaV1 = never,
+  TUtils extends UtilsRecord = UtilsRecord,
+> = CollectionConfig<T, TKey, TSchema, TUtils> & {
+  readonly [collectionOptionsBrand]: true
+}
+
+export type CollectionMaterializeOptions<T extends object> = {
+  initialData?: Array<T>
+}
+
+export type DehydratedCollectionRow<
+  T extends object = Record<string, unknown>,
+  TKey extends string | number = string | number,
+> = {
+  key: TKey
+  value: T
+  metadata?: unknown
+}
+
+export type DehydratedCollectionChunk<
+  T extends object = Record<string, unknown>,
+  TKey extends string | number = string | number,
+> = {
+  collectionId: string
+  rows: Array<DehydratedCollectionRow<T, TKey>>
+  syncMeta?: unknown
+}
+
+export type DehydratedDbState = {
+  collections: Array<DehydratedCollectionChunk>
+}
+
+type CollectionRecord = {
+  collection: Collection<any, string | number, any, any, any>
+  hasExplicitId: boolean
+}
+
+export function collectionOptions<
+  T extends StandardSchemaV1,
+  TKey extends string | number,
+  TUtils extends UtilsRecord,
+>(
+  options: CollectionConfig<InferSchemaOutput<T>, TKey, T, TUtils> & {
+    schema: T
+  } & NonSingleResult,
+): CollectionOptions<InferSchemaOutput<T>, TKey, T, TUtils> & NonSingleResult
+export function collectionOptions<
+  T extends StandardSchemaV1,
+  TKey extends string | number,
+  TUtils extends UtilsRecord,
+>(
+  options: CollectionConfig<InferSchemaOutput<T>, TKey, T, TUtils> & {
+    schema: T
+  } & SingleResult,
+): CollectionOptions<InferSchemaOutput<T>, TKey, T, TUtils> & SingleResult
+export function collectionOptions<
+  T extends object,
+  TKey extends string | number = string | number,
+  TUtils extends UtilsRecord = UtilsRecord,
+>(
+  options: CollectionConfig<T, TKey, never, TUtils> & {
+    schema?: never
+  } & NonSingleResult,
+): CollectionOptions<T, TKey, never, TUtils> & NonSingleResult
+export function collectionOptions<
+  T extends object,
+  TKey extends string | number = string | number,
+  TUtils extends UtilsRecord = UtilsRecord,
+>(
+  options: CollectionConfig<T, TKey, never, TUtils> & {
+    schema?: never
+  } & SingleResult,
+): CollectionOptions<T, TKey, never, TUtils> & SingleResult
+export function collectionOptions(
+  options: CollectionConfig<any, string | number, any, UtilsRecord>,
+): CollectionOptions<any, string | number, any, UtilsRecord> {
+  Object.defineProperty(options, collectionOptionsBrand, {
+    value: true,
+    enumerable: false,
+  })
+  return options as CollectionOptions<any, string | number, any, UtilsRecord>
+}
+
+export function isCollectionOptions(
+  value: unknown,
+): value is CollectionOptions<any, string | number, any, UtilsRecord> {
+  return (
+    typeof value === `object` &&
+    value !== null &&
+    (value as Record<PropertyKey, unknown>)[collectionOptionsBrand] === true
+  )
+}
+
+export class DbClient {
+  private collectionsByOptions = new WeakMap<
+    object,
+    Collection<any, string | number, any, any, any>
+  >()
+  private collectionsById = new Map<string, CollectionRecord>()
+  private pendingHydration = new Map<string, Array<DehydratedCollectionChunk>>()
+
+  collection<
+    T extends StandardSchemaV1,
+    TKey extends string | number,
+    TUtils extends UtilsRecord,
+  >(
+    options: CollectionOptions<InferSchemaOutput<T>, TKey, T, TUtils> &
+      NonSingleResult,
+    materializeOptions?: CollectionMaterializeOptions<InferSchemaInput<T>>,
+  ): Collection<InferSchemaOutput<T>, TKey, TUtils, T, InferSchemaInput<T>> &
+    NonSingleResult
+  collection<
+    T extends StandardSchemaV1,
+    TKey extends string | number,
+    TUtils extends UtilsRecord,
+  >(
+    options: CollectionOptions<InferSchemaOutput<T>, TKey, T, TUtils> &
+      SingleResult,
+    materializeOptions?: CollectionMaterializeOptions<InferSchemaInput<T>>,
+  ): Collection<InferSchemaOutput<T>, TKey, TUtils, T, InferSchemaInput<T>> &
+    SingleResult
+  collection<
+    T extends object,
+    TKey extends string | number = string | number,
+    TUtils extends UtilsRecord = UtilsRecord,
+  >(
+    options: CollectionOptions<T, TKey, never, TUtils> & NonSingleResult,
+    materializeOptions?: CollectionMaterializeOptions<T>,
+  ): Collection<T, TKey, TUtils, never, T> & NonSingleResult
+  collection<
+    T extends object,
+    TKey extends string | number = string | number,
+    TUtils extends UtilsRecord = UtilsRecord,
+  >(
+    options: CollectionOptions<T, TKey, never, TUtils> & SingleResult,
+    materializeOptions?: CollectionMaterializeOptions<T>,
+  ): Collection<T, TKey, TUtils, never, T> & SingleResult
+  collection(
+    options: CollectionOptions<any, string | number, any, UtilsRecord>,
+    materializeOptions?: CollectionMaterializeOptions<any>,
+  ): Collection<any, string | number, UtilsRecord, any, any> {
+    const existing = this.collectionsByOptions.get(options)
+    if (existing) {
+      return existing
+    }
+
+    const collection = createCollection(options as any)
+    if (this.collectionsById.has(collection.id)) {
+      throw new Error(
+        `Cannot materialize collection "${collection.id}" because this DbClient already has a different collection with that id. SSR hydration requires collection ids to be unique per DbClient.`,
+      )
+    }
+
+    this.collectionsByOptions.set(options, collection)
+    this.collectionsById.set(collection.id, {
+      collection,
+      hasExplicitId: options.id === collection.id,
+    })
+
+    if (materializeOptions?.initialData?.length) {
+      this.applyRows(collection, {
+        collectionId: collection.id,
+        rows: materializeOptions.initialData.map((value) => ({
+          key: options.getKey(value),
+          value,
+        })),
+      })
+    }
+
+    const pendingChunks = this.pendingHydration.get(collection.id)
+    if (pendingChunks) {
+      for (const chunk of pendingChunks) {
+        this.applyRows(collection, chunk)
+      }
+      this.pendingHydration.delete(collection.id)
+    }
+
+    return collection
+  }
+
+  dehydrate(): DehydratedDbState {
+    const collections: Array<DehydratedCollectionChunk> = []
+
+    for (const { collection, hasExplicitId } of this.collectionsById.values()) {
+      if (!hasExplicitId) {
+        throw new Error(
+          `Cannot dehydrate collection "${collection.id}" because it was created without an explicit id. SSR hydration requires stable collection ids.`,
+        )
+      }
+
+      const rows = Array.from(collection._state.syncedData.entries()).map(
+        ([key, value]) => {
+          const metadata = collection._state.syncedMetadata.get(key)
+          return {
+            key,
+            value,
+            ...(metadata === undefined ? {} : { metadata }),
+          }
+        },
+      )
+
+      collections.push({
+        collectionId: collection.id,
+        rows,
+        syncMeta: collection.config.sync.exportSyncMeta?.(),
+      })
+    }
+
+    return { collections }
+  }
+
+  hydrate(state: DehydratedDbState): void {
+    for (const chunk of state.collections) {
+      const record = this.collectionsById.get(chunk.collectionId)
+      if (record) {
+        this.applyRows(record.collection, chunk)
+        continue
+      }
+
+      const pendingChunks = this.pendingHydration.get(chunk.collectionId) ?? []
+      pendingChunks.push(chunk)
+      this.pendingHydration.set(chunk.collectionId, pendingChunks)
+    }
+  }
+
+  applyCollectionChunk(chunk: DehydratedCollectionChunk): void {
+    this.hydrate({ collections: [chunk] })
+  }
+
+  private applyRows(
+    collection: Collection<any, string | number, any, any, any>,
+    chunk: DehydratedCollectionChunk,
+  ): void {
+    const rowMetadataWrites = new Map<
+      string | number,
+      { type: `set`; value: unknown } | { type: `delete` }
+    >()
+
+    collection._state.pendingSyncedTransactions.push({
+      committed: true,
+      operations: chunk.rows.map((row) => {
+        rowMetadataWrites.set(
+          row.key,
+          row.metadata === undefined
+            ? { type: `delete` as const }
+            : { type: `set` as const, value: row.metadata },
+        )
+
+        return {
+          type: collection._state.syncedData.has(row.key) ? `update` : `insert`,
+          key: row.key,
+          value: row.value,
+        }
+      }),
+      deletedKeys: new Set(),
+      rowMetadataWrites,
+      collectionMetadataWrites: new Map(),
+      immediate: true,
+    })
+
+    collection._state.commitPendingTransactions()
+
+    if (chunk.syncMeta !== undefined) {
+      const currentMeta = collection.config.sync.exportSyncMeta?.()
+      const mergedMeta =
+        currentMeta === undefined
+          ? chunk.syncMeta
+          : (collection.config.sync.mergeSyncMeta?.(
+              currentMeta,
+              chunk.syncMeta,
+            ) ?? chunk.syncMeta)
+      collection.config.sync.importSyncMeta?.(mergedMeta)
+    }
+  }
+}
diff --git a/packages/db/src/index.ts b/packages/db/src/index.ts
index ec1e229665..c6cfc75e7a 100644
--- a/packages/db/src/index.ts
+++ b/packages/db/src/index.ts
@@ -6,6 +6,7 @@ import * as IR from './query/ir.js'
 export * from './collection/index.js'
 export * from './SortedMap'
 export * from './transactions'
+export * from './client.js'
 export * from './types'
 export * from './proxy'
 export * from './query/index.js'
diff --git a/packages/db/src/query/builder/index.ts b/packages/db/src/query/builder/index.ts
index e839008a33..4865ea591f 100644
--- a/packages/db/src/query/builder/index.ts
+++ b/packages/db/src/query/builder/index.ts
@@ -1,4 +1,5 @@
 import { CollectionImpl } from '../../collection/index.js'
+import { isCollectionOptions } from '../../client.js'
 import {
   Aggregate as AggregateExpr,
   CollectionRef,
@@ -35,6 +36,7 @@ import {
 } from './functions.js'
 import type { SourceClauseContext } from '../../errors.js'
 import type { NamespacedRow, SingleResult } from '../../types.js'
+import type { CollectionOptions } from '../../client.js'
 import type {
   Aggregate,
   BasicExpression,
@@ -72,15 +74,28 @@ import type {
   WithResult,
 } from './types.js'
 
+type CollectionResolver = (
+  options: CollectionOptions<any, string | number, any, any>,
+) => CollectionImpl<any, string | number, any, any, any>
+
 const UNION_ALL_SOURCE_CONTEXT = `unionAll clause` satisfies SourceClauseContext
 
 export class BaseQueryBuilder<TContext extends Context = Context> {
   private readonly query: Partial<QueryIR> = {}
 
-  constructor(query: Partial<QueryIR> = {}) {
+  constructor(
+    query: Partial<QueryIR> = {},
+    private readonly resolveCollection?: CollectionResolver,
+  ) {
     this.query = { ...query }
   }
 
+  private _clone<TNextContext extends Context = Context>(
+    query: Partial<QueryIR>,
+  ): BaseQueryBuilder<TNextContext> {
+    return new BaseQueryBuilder<TNextContext>(query, this.resolveCollection)
+  }
+
   /**
    * Creates a CollectionRef or QueryRef from a source object
    * @param source - An object with a single key-value pair
@@ -139,6 +154,13 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
 
       if (sourceValue instanceof CollectionImpl) {
         ref = new CollectionRef(sourceValue, alias)
+      } else if (isCollectionOptions(sourceValue)) {
+        if (!this.resolveCollection) {
+          throw new Error(
+            `Cannot use collection descriptor "${alias}" as a query source without a DbClient resolver. In React, wrap your tree in <DbProvider>.`,
+          )
+        }
+        ref = new CollectionRef(this.resolveCollection(sourceValue), alias)
       } else if (sourceValue instanceof BaseQueryBuilder) {
         const subQuery = sourceValue._getQuery()
         if (!(subQuery as Partial<QueryIR>).from) {
@@ -176,7 +198,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
   ): QueryBuilder<ContextFromSource<TSource>> {
     const [, from] = this._createRefForSource(source, `from clause`)
 
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       from,
     }) as any
@@ -208,7 +230,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
     ...branches: Array<QueryBuilder<any>>
   ): QueryBuilder<any> {
     if (sourceOrBranch instanceof BaseQueryBuilder) {
-      return new BaseQueryBuilder({
+      return this._clone({
         ...this.query,
         from: new UnionAll(
           [sourceOrBranch, ...branches].map((branch) =>
@@ -225,7 +247,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
     const from =
       refs.length === 1 ? refs[0]![1] : new UnionFrom(refs.map((r) => r[1]))
 
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       from,
     }) as any
@@ -307,7 +329,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
 
     const existingJoins = this.query.join || []
 
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       join: [...existingJoins, joinClause],
     }) as any
@@ -466,7 +488,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
 
     const existingWhere = this.query.where || []
 
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       where: [...existingWhere, expression],
     }) as any
@@ -526,7 +548,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
 
     const existingHaving = this.query.having || []
 
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       having: [...existingHaving, expression],
     }) as any
@@ -592,7 +614,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
 
     const select = buildNestedSelect(selectObject, aliases)
 
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       select: select,
       fnSelect: undefined, // remove the fnSelect clause if it exists
@@ -667,7 +689,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
 
     const existingOrderBy: OrderBy = this.query.orderBy || []
 
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       orderBy: [...existingOrderBy, ...orderByClauses],
     }) as any
@@ -712,7 +734,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
 
     // Extend existing groupBy expressions (multiple groupBy calls should accumulate)
     const existingGroupBy = this.query.groupBy || []
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       groupBy: [...existingGroupBy, ...newExpressions],
     }) as any
@@ -735,7 +757,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
    * ```
    */
   limit(count: number): QueryBuilder<TContext> {
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       limit: count,
     }) as any
@@ -759,7 +781,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
    * ```
    */
   offset(count: number): QueryBuilder<TContext> {
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       offset: count,
     }) as any
@@ -780,7 +802,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
    * ```
    */
   distinct(): QueryBuilder<TContext> {
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       distinct: true,
     }) as any
@@ -800,7 +822,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
    *```
    */
   findOne(): QueryBuilder<TContext & SingleResult> {
-    return new BaseQueryBuilder({
+    return this._clone({
       ...this.query,
       // TODO: enforcing return only one result with also a default orderBy if none is specified
       // limit: 1,
@@ -870,7 +892,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
       select<TFuncSelectResult>(
         callback: (row: TContext[`schema`]) => TFuncSelectResult,
       ): QueryBuilder<WithResult<TContext, TFuncSelectResult>> {
-        return new BaseQueryBuilder({
+        return builder._clone({
           ...builder.query,
           select: undefined, // remove the select clause if it exists
           fnSelect: callback,
@@ -894,7 +916,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
       where(
         callback: (row: TContext[`schema`]) => any,
       ): QueryBuilder<TContext> {
-        return new BaseQueryBuilder({
+        return builder._clone({
           ...builder.query,
           fnWhere: [
             ...(builder.query.fnWhere || []),
@@ -922,7 +944,7 @@ export class BaseQueryBuilder<TContext extends Context = Context> {
       having(
         callback: (row: FunctionalHavingRow<TContext>) => any,
       ): QueryBuilder<TContext> {
-        return new BaseQueryBuilder({
+        return builder._clone({
           ...builder.query,
           fnHaving: [
             ...(builder.query.fnHaving || []),
diff --git a/packages/db/src/query/builder/types.ts b/packages/db/src/query/builder/types.ts
index a756a13794..913f8f0b40 100644
--- a/packages/db/src/query/builder/types.ts
+++ b/packages/db/src/query/builder/types.ts
@@ -1,4 +1,5 @@
 import type { Collection, CollectionImpl } from '../../collection/index.js'
+import type { CollectionOptions } from '../../client.js'
 import type { SingleResult, StringCollationConfig } from '../../types.js'
 import type {
   Aggregate,
@@ -88,7 +89,10 @@ export type ContextSchema = Record<string, unknown>
  * Example: `{ users: usersCollection }`
  */
 export type Source = {
-  [alias: string]: CollectionImpl<any, any> | QueryBuilder<Context>
+  [alias: string]:
+    | CollectionImpl<any, any>
+    | CollectionOptions<any, any, any, any>
+    | QueryBuilder<Context>
 }
 
 /**
@@ -100,7 +104,9 @@ export type Source = {
 export type InferCollectionType<T> =
   T extends CollectionImpl<infer TOutput, infer TKey, any, any, any>
     ? WithVirtualProps<TOutput, TKey>
-    : never
+    : T extends CollectionOptions<infer TOutput, infer TKey, any, any>
+      ? WithVirtualProps<TOutput, TKey>
+      : never
 
 /**
  * SchemaFromSource - Converts a Source definition into a ContextSchema
@@ -115,9 +121,11 @@ export type InferCollectionType<T> =
 export type SchemaFromSource<T extends Source> = Prettify<{
   [K in keyof T]: T[K] extends CollectionImpl<any, any, any, any, any>
     ? InferCollectionType<T[K]>
-    : T[K] extends QueryBuilder<infer TContext>
-      ? GetResult<TContext>
-      : never
+    : T[K] extends CollectionOptions<any, any, any, any>
+      ? InferCollectionType<T[K]>
+      : T[K] extends QueryBuilder<infer TContext>
+        ? GetResult<TContext>
+        : never
 }>
 
 export type UnionRefsSchema<TSchema extends ContextSchema> = Prettify<{
diff --git a/packages/db/src/query/index.ts b/packages/db/src/query/index.ts
index 70f0c0c910..cdf11d20d4 100644
--- a/packages/db/src/query/index.ts
+++ b/packages/db/src/query/index.ts
@@ -91,6 +91,12 @@ export { queryOnce, type QueryOnceConfig } from './query-once.js'
 
 export { type LiveQueryCollectionConfig } from './live/types.js'
 export { type LiveQueryCollectionUtils } from './live/collection-config-builder.js'
+export {
+  UnhashableQueryIRError,
+  canonicalizeQueryIR,
+  getStableQueryBuilderHash,
+  getStableQueryIRHash,
+} from './ir-stable-identity.js'
 
 // Predicate utilities for predicate push-down
 export {
diff --git a/packages/db/src/query/ir-stable-identity.ts b/packages/db/src/query/ir-stable-identity.ts
new file mode 100644
index 0000000000..87a1545d7d
--- /dev/null
+++ b/packages/db/src/query/ir-stable-identity.ts
@@ -0,0 +1,532 @@
+import { isRefProxy, toExpression } from './builder/ref-proxy.js'
+import { getQueryIR } from './builder/index.js'
+import type {
+  Aggregate,
+  BasicExpression,
+  ConditionalSelect,
+  From,
+  Having,
+  IncludesSubquery,
+  JoinClause,
+  OrderByClause,
+  QueryIR,
+  Select,
+  Where,
+} from './ir.js'
+import type { InitialQueryBuilder, QueryBuilder } from './builder/index.js'
+
+type StableIdentityValue =
+  | null
+  | boolean
+  | number
+  | string
+  | Array<StableIdentityValue>
+  | { [key: string]: StableIdentityValue }
+
+export class UnhashableQueryIRError extends Error {
+  constructor(
+    public readonly path: string,
+    public readonly reason: string,
+  ) {
+    super(`Query IR is not stably hashable at ${path}: ${reason}`)
+    this.name = `UnhashableQueryIRError`
+  }
+}
+
+export function getStableQueryIRHash(query: QueryIR): string {
+  return JSON.stringify(canonicalizeQueryIR(query))
+}
+
+export function getStableQueryBuilderHash(
+  query: InitialQueryBuilder | QueryBuilder<any>,
+): string {
+  return getStableQueryIRHash(getQueryIR(query))
+}
+
+export function canonicalizeQueryIR(query: QueryIR): StableIdentityValue {
+  return canonicalizeQuery(query, `query`, new WeakSet<object>())
+}
+
+function canonicalizeQuery(
+  query: QueryIR,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  if (query.fnSelect) {
+    throw new UnhashableQueryIRError(`${path}.fnSelect`, `function select`)
+  }
+
+  if (query.fnWhere?.length) {
+    throw new UnhashableQueryIRError(`${path}.fnWhere`, `function where`)
+  }
+
+  if (query.fnHaving?.length) {
+    throw new UnhashableQueryIRError(`${path}.fnHaving`, `function having`)
+  }
+
+  const result: Record<string, StableIdentityValue> = {
+    type: `query`,
+    from: canonicalizeSource(query.from, `${path}.from`, seen),
+  }
+
+  if (query.select) {
+    result.select = canonicalizeSelect(query.select, `${path}.select`, seen)
+  }
+
+  if (query.join) {
+    result.join = query.join.map((join, index) =>
+      canonicalizeJoin(join, `${path}.join[${index}]`, seen),
+    )
+  }
+
+  if (query.where) {
+    result.where = query.where.map((where, index) =>
+      canonicalizeWhere(where, `${path}.where[${index}]`, seen),
+    )
+  }
+
+  if (query.groupBy) {
+    result.groupBy = query.groupBy.map((expression, index) =>
+      canonicalizeExpression(expression, `${path}.groupBy[${index}]`, seen),
+    )
+  }
+
+  if (query.having) {
+    result.having = query.having.map((having, index) =>
+      canonicalizeWhere(having, `${path}.having[${index}]`, seen),
+    )
+  }
+
+  if (query.orderBy) {
+    result.orderBy = query.orderBy.map((orderBy, index) =>
+      canonicalizeOrderBy(orderBy, `${path}.orderBy[${index}]`, seen),
+    )
+  }
+
+  if (query.limit !== undefined) {
+    result.limit = canonicalizeRuntimeValue(query.limit, `${path}.limit`, seen)
+  }
+
+  if (query.offset !== undefined) {
+    result.offset = canonicalizeRuntimeValue(
+      query.offset,
+      `${path}.offset`,
+      seen,
+    )
+  }
+
+  if (query.distinct) {
+    result.distinct = true
+  }
+
+  if (query.singleResult) {
+    result.singleResult = true
+  }
+
+  return result
+}
+
+function canonicalizeJoin(
+  join: JoinClause,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  return {
+    type: join.type,
+    from: canonicalizeSource(join.from, `${path}.from`, seen),
+    left: canonicalizeExpression(join.left, `${path}.left`, seen),
+    right: canonicalizeExpression(join.right, `${path}.right`, seen),
+  }
+}
+
+function canonicalizeSource(
+  source: From,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  if (source.type === `collectionRef`) {
+    return {
+      type: `collectionRef`,
+      alias: source.alias,
+      collectionId: canonicalizeRuntimeValue(
+        source.collection.id,
+        `${path}.collection.id`,
+        seen,
+      ),
+    }
+  }
+
+  if (source.type === `unionFrom`) {
+    return {
+      type: `unionFrom`,
+      sources: [...source.sources]
+        .sort((a, b) => a.alias.localeCompare(b.alias))
+        .map((unionSource, index) =>
+          canonicalizeSource(unionSource, `${path}.sources[${index}]`, seen),
+        ),
+    }
+  }
+
+  if (source.type === `unionAll`) {
+    return {
+      type: `unionAll`,
+      queries: source.queries.map((query, index) =>
+        canonicalizeQuery(query, `${path}.queries[${index}]`, seen),
+      ),
+    }
+  }
+
+  return {
+    type: `queryRef`,
+    alias: source.alias,
+    query: canonicalizeQuery(source.query, `${path}.query`, seen),
+  }
+}
+
+function canonicalizeSelect(
+  select: Select,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  const result: Record<string, StableIdentityValue> = {}
+
+  for (const key of Object.keys(select).sort()) {
+    result[key] = canonicalizeSelectValue(select[key]!, `${path}.${key}`, seen)
+  }
+
+  return result
+}
+
+function canonicalizeSelectValue(
+  value: unknown,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  if (isRefProxy(value)) {
+    return canonicalizeExpression(toExpression(value), path, seen)
+  }
+
+  if (isExpression(value)) {
+    return canonicalizeExpression(value, path, seen)
+  }
+
+  if (isPlainObject(value)) {
+    return canonicalizeSelect(value as Select, path, seen)
+  }
+
+  return canonicalizeRuntimeValue(value, path, seen)
+}
+
+function canonicalizeWhere(
+  where: Where | Having,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  if (isWhereObject(where)) {
+    const result: Record<string, StableIdentityValue> = {
+      type: `where`,
+      expression: canonicalizeExpression(
+        where.expression,
+        `${path}.expression`,
+        seen,
+      ),
+    }
+
+    if (where.residual === true) {
+      result.residual = true
+    }
+
+    return result
+  }
+
+  return canonicalizeExpression(where, path, seen)
+}
+
+function canonicalizeOrderBy(
+  orderBy: OrderByClause,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  return {
+    expression: canonicalizeExpression(
+      orderBy.expression,
+      `${path}.expression`,
+      seen,
+    ),
+    compareOptions: canonicalizeRuntimeValue(
+      orderBy.compareOptions,
+      `${path}.compareOptions`,
+      seen,
+    ),
+  }
+}
+
+function canonicalizeExpression(
+  expression:
+    | BasicExpression
+    | Aggregate
+    | IncludesSubquery
+    | ConditionalSelect,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  if (expression.type === `ref`) {
+    return {
+      type: `ref`,
+      path: expression.path.map((segment, index) =>
+        canonicalizeRuntimeValue(segment, `${path}.path[${index}]`, seen),
+      ),
+    }
+  }
+
+  if (expression.type === `val`) {
+    return {
+      type: `val`,
+      value: canonicalizeRuntimeValue(expression.value, `${path}.value`, seen),
+    }
+  }
+
+  if (expression.type === `func`) {
+    return {
+      type: `func`,
+      name: expression.name,
+      args: expression.args.map((arg, index) =>
+        canonicalizeExpression(arg, `${path}.args[${index}]`, seen),
+      ),
+    }
+  }
+
+  if (expression.type === `agg`) {
+    return {
+      type: `agg`,
+      name: expression.name,
+      args: expression.args.map((arg, index) =>
+        canonicalizeExpression(arg, `${path}.args[${index}]`, seen),
+      ),
+    }
+  }
+
+  if (expression.type === `conditionalSelect`) {
+    const result: Record<string, StableIdentityValue> = {
+      type: `conditionalSelect`,
+      branches: expression.branches.map((branch, index) => ({
+        condition: canonicalizeExpression(
+          branch.condition,
+          `${path}.branches[${index}].condition`,
+          seen,
+        ),
+        value: canonicalizeSelectValue(
+          branch.value,
+          `${path}.branches[${index}].value`,
+          seen,
+        ),
+      })),
+    }
+
+    if (expression.defaultValue !== undefined) {
+      result.defaultValue = canonicalizeSelectValue(
+        expression.defaultValue,
+        `${path}.defaultValue`,
+        seen,
+      )
+    }
+
+    return result
+  }
+
+  const result: Record<string, StableIdentityValue> = {
+    type: `includesSubquery`,
+    query: canonicalizeQuery(expression.query, `${path}.query`, seen),
+    correlationField: canonicalizeExpression(
+      expression.correlationField,
+      `${path}.correlationField`,
+      seen,
+    ),
+    childCorrelationField: canonicalizeExpression(
+      expression.childCorrelationField,
+      `${path}.childCorrelationField`,
+      seen,
+    ),
+    fieldName: expression.fieldName,
+    materialization: expression.materialization,
+  }
+
+  if (expression.parentFilters) {
+    result.parentFilters = expression.parentFilters.map((where, index) =>
+      canonicalizeWhere(where, `${path}.parentFilters[${index}]`, seen),
+    )
+  }
+
+  if (expression.parentProjection) {
+    result.parentProjection = expression.parentProjection.map(
+      (projection, index) =>
+        canonicalizeExpression(
+          projection,
+          `${path}.parentProjection[${index}]`,
+          seen,
+        ),
+    )
+  }
+
+  if (expression.scalarField !== undefined) {
+    result.scalarField = expression.scalarField
+  }
+
+  return result
+}
+
+function canonicalizeRuntimeValue(
+  value: unknown,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  if (value === null) return null
+
+  if (typeof value === `string` || typeof value === `boolean`) {
+    return value
+  }
+
+  if (typeof value === `number`) {
+    if (Number.isNaN(value)) {
+      return { type: `number`, value: `NaN` }
+    }
+
+    if (value === Infinity) {
+      return { type: `number`, value: `Infinity` }
+    }
+
+    if (value === -Infinity) {
+      return { type: `number`, value: `-Infinity` }
+    }
+
+    if (Object.is(value, -0)) {
+      return { type: `number`, value: `-0` }
+    }
+
+    return value
+  }
+
+  if (typeof value === `undefined`) {
+    return { type: `undefined` }
+  }
+
+  if (typeof value === `bigint`) {
+    return { type: `bigint`, value: value.toString() }
+  }
+
+  if (typeof value === `function`) {
+    throw new UnhashableQueryIRError(path, `function value`)
+  }
+
+  if (typeof value === `symbol`) {
+    throw new UnhashableQueryIRError(path, `symbol value`)
+  }
+
+  if (isRefProxy(value)) {
+    return canonicalizeExpression(toExpression(value), path, seen)
+  }
+
+  if (Array.isArray(value)) {
+    return withCircularGuard(value, path, seen, () =>
+      value.map((item, index) =>
+        canonicalizeRuntimeValue(item, `${path}[${index}]`, seen),
+      ),
+    )
+  }
+
+  if (value instanceof Date) {
+    const timestamp = value.getTime()
+    if (Number.isNaN(timestamp)) {
+      throw new UnhashableQueryIRError(path, `invalid Date`)
+    }
+
+    return { type: `Date`, value: value.toISOString() }
+  }
+
+  if (value instanceof ArrayBuffer) {
+    return {
+      type: `ArrayBuffer`,
+      value: Array.from(new Uint8Array(value)),
+    }
+  }
+
+  if (ArrayBuffer.isView(value)) {
+    return {
+      type: value.constructor.name,
+      value: Array.from(
+        new Uint8Array(value.buffer, value.byteOffset, value.byteLength),
+      ),
+    }
+  }
+
+  if (isPlainObject(value)) {
+    return canonicalizeObject(value, path, seen)
+  }
+
+  throw new UnhashableQueryIRError(path, `non-plain object value`)
+}
+
+function canonicalizeObject(
+  value: Record<string, unknown>,
+  path: string,
+  seen: WeakSet<object>,
+): StableIdentityValue {
+  return withCircularGuard(value, path, seen, () => {
+    const result: Record<string, StableIdentityValue> = {}
+
+    for (const key of Object.keys(value).sort()) {
+      result[key] = canonicalizeRuntimeValue(value[key], `${path}.${key}`, seen)
+    }
+
+    return result
+  })
+}
+
+function withCircularGuard<T>(
+  value: object,
+  path: string,
+  seen: WeakSet<object>,
+  callback: () => T,
+): T {
+  if (seen.has(value)) {
+    throw new UnhashableQueryIRError(path, `circular value`)
+  }
+
+  seen.add(value)
+  try {
+    return callback()
+  } finally {
+    seen.delete(value)
+  }
+}
+
+function isWhereObject(
+  where: Where | Having,
+): where is { expression: BasicExpression<boolean>; residual?: boolean } {
+  return `expression` in where
+}
+
+function isExpression(
+  value: unknown,
+): value is BasicExpression | Aggregate | IncludesSubquery {
+  if (value === null || typeof value !== `object`) {
+    return false
+  }
+
+  const expressionType = (value as { type?: unknown }).type
+  return (
+    expressionType === `agg` ||
+    expressionType === `conditionalSelect` ||
+    expressionType === `func` ||
+    expressionType === `ref` ||
+    expressionType === `val` ||
+    expressionType === `includesSubquery`
+  )
+}
+
+function isPlainObject(value: unknown): value is Record<string, unknown> {
+  if (value === null || typeof value !== `object`) return false
+
+  const prototype = Object.getPrototypeOf(value)
+  return prototype === Object.prototype || prototype === null
+}
diff --git a/packages/db/src/types.ts b/packages/db/src/types.ts
index 6087e234ec..bae05a943f 100644
--- a/packages/db/src/types.ts
+++ b/packages/db/src/types.ts
@@ -349,6 +349,22 @@ export interface SyncConfig<
    */
   getSyncMetadata?: () => Record<string, unknown>
 
+  /**
+   * Export adapter-specific metadata that lets hydration/persistence resume sync.
+   * The payload shape is owned by the adapter.
+   */
+  exportSyncMeta?: () => unknown
+
+  /**
+   * Import adapter-specific metadata produced by exportSyncMeta.
+   */
+  importSyncMeta?: (meta: unknown) => void
+
+  /**
+   * Merge two adapter-specific metadata payloads during hydration.
+   */
+  mergeSyncMeta?: (current: unknown, incoming: unknown) => unknown
+
   /**
    * The row update mode used to sync to the collection.
    * @default `partial`
diff --git a/packages/db/tests/collection.test-d.ts b/packages/db/tests/collection.test-d.ts
index 32edff2f8d..8a29fa3ff8 100644
--- a/packages/db/tests/collection.test-d.ts
+++ b/packages/db/tests/collection.test-d.ts
@@ -1,6 +1,7 @@
 import { assertType, describe, expectTypeOf, it } from 'vitest'
 import { z } from 'zod'
 import { createCollection } from '../src/collection/index.js'
+import { DbClient, collectionOptions } from '../src/index.js'
 import type { OutputWithVirtual } from './utils'
 import type { OperationConfig } from '../src/types'
 import type { StandardSchemaV1 } from '@standard-schema/spec'
@@ -162,6 +163,42 @@ describe(`Collection type resolution tests`, () => {
   })
 })
 
+describe(`DbClient type tests`, () => {
+  type Todo = { id: string; text: string }
+
+  it(`materializes typed collection options`, () => {
+    const todos = collectionOptions<Todo, string>({
+      id: `todos`,
+      getKey: (todo) => todo.id,
+      sync: { sync: () => {} },
+    })
+
+    const client = new DbClient()
+    const collection = client.collection(todos)
+
+    expectTypeOf(collection.get(`1`)).toEqualTypeOf<
+      OutputWithVirtual<Todo, string> | undefined
+    >()
+  })
+
+  it(`accepts materialization initialData`, () => {
+    const todos = collectionOptions<Todo, string>({
+      id: `todos`,
+      getKey: (todo) => todo.id,
+      sync: { sync: () => {} },
+    })
+
+    const client = new DbClient()
+    const collection = client.collection(todos, {
+      initialData: [{ id: `1`, text: `Write tests` }],
+    })
+
+    expectTypeOf(collection.toArray).toEqualTypeOf<
+      Array<OutputWithVirtual<Todo, string>>
+    >()
+  })
+})
+
 describe(`Schema Input/Output Type Distinction`, () => {
   // Define schema with different input/output types
   const userSchemaWithDefaults = z.object({
diff --git a/packages/db/tests/db-client.test.ts b/packages/db/tests/db-client.test.ts
new file mode 100644
index 0000000000..c1d469a021
--- /dev/null
+++ b/packages/db/tests/db-client.test.ts
@@ -0,0 +1,457 @@
+import { describe, expect, it, vi } from 'vitest'
+import {
+  DbClient,
+  collectionOptions,
+  createLiveQueryCollection,
+  eq,
+} from '../src'
+import { mockSyncCollectionOptions } from './utils'
+
+type Person = {
+  id: string
+  name: string
+  status?: string
+}
+
+const people: Array<Person> = [
+  { id: `1`, name: `Tanner`, status: `active` },
+  { id: `2`, name: `Kyle`, status: `inactive` },
+]
+
+describe(`DbClient`, () => {
+  it(`memoizes materialized collections per client and isolates clients`, () => {
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: people,
+      }),
+    )
+
+    const clientA = new DbClient()
+    const clientB = new DbClient()
+
+    const peopleA1 = clientA.collection(descriptor)
+    const peopleA2 = clientA.collection(descriptor)
+    const peopleB = clientB.collection(descriptor)
+
+    expect(peopleA1).toBe(peopleA2)
+    expect(peopleA1).not.toBe(peopleB)
+    expect(peopleA1.toArray).toHaveLength(2)
+    expect(peopleB.toArray).toHaveLength(2)
+  })
+
+  it(`serializes collection rows and sync metadata from explicit ids`, () => {
+    let syncMeta = { version: 1, cursor: `a` }
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: people,
+        sync: {
+          sync: ({ begin, write, commit, markReady }) => {
+            begin()
+            write({
+              type: `insert`,
+              value: people[0]!,
+              metadata: { source: `server` },
+            })
+            commit()
+            markReady()
+          },
+          exportSyncMeta: () => syncMeta,
+          importSyncMeta: (meta) => {
+            syncMeta = meta as typeof syncMeta
+          },
+          mergeSyncMeta: (_current, incoming) => incoming,
+        },
+      }),
+    )
+
+    const client = new DbClient()
+    client.collection(descriptor)
+
+    const dehydrated = client.dehydrate()
+
+    expect(dehydrated).toEqual({
+      collections: [
+        {
+          collectionId: `people`,
+          rows: [
+            {
+              key: `1`,
+              value: people[0],
+              metadata: { source: `server` },
+            },
+          ],
+          syncMeta: { version: 1, cursor: `a` },
+        },
+      ],
+    })
+  })
+
+  it(`serializes only collections materialized through the client`, () => {
+    const peopleDescriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: people,
+      }),
+    )
+    collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `unused-people`,
+        getKey: (person) => person.id,
+        initialData: [{ id: `3`, name: `Unused` }],
+      }),
+    )
+
+    const client = new DbClient()
+
+    expect(client.dehydrate()).toEqual({ collections: [] })
+
+    client.collection(peopleDescriptor)
+
+    expect(
+      client.dehydrate().collections.map((chunk) => chunk.collectionId),
+    ).toEqual([`people`])
+  })
+
+  it(`requires collection ids to be unique per client`, () => {
+    const firstDescriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: [people[0]!],
+      }),
+    )
+    const secondDescriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: [people[1]!],
+      }),
+    )
+
+    const client = new DbClient()
+    client.collection(firstDescriptor)
+
+    expect(() => client.collection(secondDescriptor)).toThrow(
+      /collection ids to be unique per DbClient/,
+    )
+  })
+
+  it(`requires stable explicit collection ids for dehydration`, () => {
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: undefined as unknown as string,
+        getKey: (person) => person.id,
+        initialData: people,
+      }),
+    )
+
+    const client = new DbClient()
+    client.collection(descriptor)
+
+    expect(() => client.dehydrate()).toThrow(
+      /SSR hydration requires stable collection ids/,
+    )
+  })
+
+  it(`does not treat an empty collection id as stable for dehydration`, () => {
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: ``,
+        getKey: (person) => person.id,
+        initialData: people,
+      }),
+    )
+
+    const client = new DbClient()
+    client.collection(descriptor)
+
+    expect(() => client.dehydrate()).toThrow(
+      /SSR hydration requires stable collection ids/,
+    )
+  })
+
+  it(`hydrates pending collection rows when the collection materializes`, () => {
+    const importedMeta = vi.fn()
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: [],
+        sync: {
+          sync: ({ markReady }) => {
+            markReady()
+          },
+          importSyncMeta: importedMeta,
+        },
+      }),
+    )
+
+    const client = new DbClient()
+    client.hydrate({
+      collections: [
+        {
+          collectionId: `people`,
+          rows: [
+            {
+              key: `1`,
+              value: people[0]!,
+              metadata: { source: `ssr` },
+            },
+          ],
+          syncMeta: { version: 1, cursor: `ssr` },
+        },
+      ],
+    })
+
+    const collection = client.collection(descriptor)
+
+    expect(collection.get(`1`)).toMatchObject(people[0]!)
+    expect(collection._state.syncedMetadata.get(`1`)).toEqual({
+      source: `ssr`,
+    })
+    expect(importedMeta).toHaveBeenCalledWith({ version: 1, cursor: `ssr` })
+    expect(collection.status).toBe(`ready`)
+  })
+
+  it(`merges sync metadata before importing hydration metadata`, () => {
+    let syncMeta: unknown = { version: 1, cursor: `client` }
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: [],
+        sync: {
+          sync: ({ markReady }) => {
+            markReady()
+          },
+          exportSyncMeta: () => syncMeta,
+          importSyncMeta: (meta) => {
+            syncMeta = meta
+          },
+          mergeSyncMeta: (current, incoming) => ({ current, incoming }),
+        },
+      }),
+    )
+
+    const client = new DbClient()
+    client.collection(descriptor)
+
+    client.hydrate({
+      collections: [
+        {
+          collectionId: `people`,
+          rows: [],
+          syncMeta: { version: 1, cursor: `server` },
+        },
+      ],
+    })
+
+    expect(syncMeta).toEqual({
+      current: { version: 1, cursor: `client` },
+      incoming: { version: 1, cursor: `server` },
+    })
+  })
+
+  it(`applies streaming collection chunks and live queries react from collection state`, async () => {
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: [],
+        sync: {
+          sync: ({ markReady }) => {
+            markReady()
+          },
+        },
+      }),
+    )
+
+    const client = new DbClient()
+    const collection = client.collection(descriptor)
+    const activePeople = createLiveQueryCollection((q) =>
+      q
+        .from({ person: collection })
+        .where(({ person }) => eq(person.status, `active`)),
+    )
+    await activePeople.preload()
+
+    client.applyCollectionChunk({
+      collectionId: `people`,
+      rows: [{ key: `1`, value: people[0]! }],
+    })
+
+    expect(activePeople.toArray.map((person) => person.id)).toEqual([`1`])
+  })
+
+  it(`live query preload dehydrates source collection rows instead of live query snapshots`, async () => {
+    const descriptor = collectionOptions({
+      id: `people`,
+      getKey: (person: Person) => person.id,
+      syncMode: `on-demand`,
+      sync: {
+        sync: ({ begin, write, commit, markReady }) => {
+          markReady()
+
+          return {
+            loadSubset: () => {
+              begin({ immediate: true })
+              for (const person of people) {
+                write({
+                  type: `insert`,
+                  value: person,
+                })
+              }
+              commit()
+              return true
+            },
+          }
+        },
+      },
+    })
+
+    const client = new DbClient()
+    const collection = client.collection(descriptor)
+    const activePeople = createLiveQueryCollection((q) =>
+      q
+        .from({ person: collection })
+        .where(({ person }) => eq(person.status, `active`)),
+    )
+
+    await activePeople.preload()
+
+    expect(activePeople.toArray.map((person) => person.id)).toEqual([`1`])
+    expect(client.dehydrate()).toEqual({
+      collections: [
+        {
+          collectionId: `people`,
+          rows: people.map((person) => ({
+            key: person.id,
+            value: person,
+          })),
+          syncMeta: undefined,
+        },
+      ],
+    })
+  })
+
+  it(`hydrates rows without running mutation handlers or creating optimistic state`, () => {
+    const onInsert = vi.fn()
+    const descriptor = collectionOptions({
+      id: `people`,
+      getKey: (person: Person) => person.id,
+      sync: {
+        sync: ({ markReady }) => {
+          markReady()
+        },
+      },
+      onInsert,
+    })
+
+    const client = new DbClient()
+    const collection = client.collection(descriptor)
+
+    client.hydrate({
+      collections: [
+        {
+          collectionId: `people`,
+          rows: [{ key: `1`, value: people[0]! }],
+        },
+      ],
+    })
+
+    expect(onInsert).not.toHaveBeenCalled()
+    expect(collection._state.optimisticUpserts.size).toBe(0)
+    expect(collection._state.optimisticDeletes.size).toBe(0)
+    expect(collection.get(`1`)).toMatchObject(people[0]!)
+  })
+
+  it(`does not serialize optimistic pending mutations`, async () => {
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: [people[0]!],
+      }),
+    )
+
+    const client = new DbClient()
+    const collection = client.collection(descriptor)
+    const tx = collection.insert({ id: `3`, name: `Pending` })
+
+    expect(collection._state.optimisticUpserts.has(`3`)).toBe(true)
+    expect(client.dehydrate()).toEqual({
+      collections: [
+        {
+          collectionId: `people`,
+          rows: [
+            {
+              key: `1`,
+              value: people[0],
+            },
+          ],
+          syncMeta: undefined,
+        },
+      ],
+    })
+
+    collection.utils.resolveSync()
+    await tx.isPersisted.promise
+  })
+
+  it(`applies initialData precedence before hydrated rows`, () => {
+    const descriptor = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `people`,
+        getKey: (person) => person.id,
+        initialData: [{ id: `1`, name: `descriptor` }],
+      }),
+    )
+
+    const client = new DbClient()
+    const collection = client.collection(descriptor, {
+      initialData: [{ id: `1`, name: `materialized` }],
+    })
+
+    expect(collection.get(`1`)).toMatchObject({
+      id: `1`,
+      name: `materialized`,
+    })
+
+    client.hydrate({
+      collections: [
+        {
+          collectionId: `people`,
+          rows: [{ key: `1`, value: { id: `1`, name: `hydrated` } }],
+        },
+      ],
+    })
+
+    expect(collection.get(`1`)).toMatchObject({
+      id: `1`,
+      name: `hydrated`,
+    })
+  })
+
+  it(`seeds initialData without marking adapter sync as ready`, () => {
+    const descriptor = collectionOptions<Person, string>({
+      id: `people`,
+      getKey: (person) => person.id,
+      sync: {
+        sync: () => {},
+      },
+    })
+
+    const client = new DbClient()
+    const collection = client.collection(descriptor, {
+      initialData: [people[0]!],
+    })
+
+    expect(collection.get(`1`)).toMatchObject(people[0]!)
+    expect(collection.status).not.toBe(`ready`)
+  })
+})
diff --git a/packages/db/tests/query/ir-stable-identity.test.ts b/packages/db/tests/query/ir-stable-identity.test.ts
new file mode 100644
index 0000000000..4a4f95c7e1
--- /dev/null
+++ b/packages/db/tests/query/ir-stable-identity.test.ts
@@ -0,0 +1,476 @@
+import { describe, expect, it } from 'vitest'
+import { CollectionImpl } from '../../src/collection/index.js'
+import { Query, getQueryIR } from '../../src/query/builder/index.js'
+import {
+  add,
+  and,
+  avg,
+  caseWhen,
+  coalesce,
+  concat,
+  count,
+  eq,
+  gt,
+  gte,
+  inArray,
+  isNull,
+  isUndefined,
+  length,
+  like,
+  lower,
+  max,
+  not,
+  or,
+  sum,
+  upper,
+} from '../../src/query/builder/functions.js'
+import {
+  UnhashableQueryIRError,
+  getStableQueryIRHash,
+} from '../../src/query/ir-stable-identity.js'
+import type { QueryIR } from '../../src/query/ir.js'
+
+interface User {
+  id: number
+  name: string
+  email?: string | null
+  active: boolean
+  age: number
+  salary: number
+  status: `active` | `inactive`
+  teamId: string
+  departmentId: number | null
+  createdAt: Date
+  profile?: {
+    skills: Array<string>
+    experience: {
+      years: number
+    }
+  }
+  blob?: Uint8Array
+  largeViewCount?: bigint
+}
+
+interface Post {
+  id: number
+  userId: number
+  title: string
+  published: boolean
+  views: number
+  createdAt: Date
+}
+
+const usersCollection = new CollectionImpl<User>({
+  id: `users`,
+  getKey: (item) => item.id,
+  sync: { sync: () => {} },
+})
+
+const postsCollection = new CollectionImpl<Post>({
+  id: `posts`,
+  getKey: (item) => item.id,
+  sync: { sync: () => {} },
+})
+
+const structuredQueries: Array<[string, () => QueryIR]> = [
+  [
+    `basic collection source`,
+    () => getQueryIR(new Query().from({ user: usersCollection })),
+  ],
+  [
+    `captured primitive where value`,
+    () => {
+      const status = `active` as const
+      return getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .where(({ user }) => eq(user.status, status)),
+      )
+    },
+  ],
+  [
+    `boolean expression tree`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .where(({ user }) =>
+            and(
+              eq(user.active, true),
+              or(gt(user.age, 30), not(isNull(user.email))),
+            ),
+          ),
+      ),
+  ],
+  [
+    `array membership and undefined checks`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .where(({ user }) =>
+            and(
+              inArray(user.teamId, [`eng`, `design`]),
+              not(isUndefined(user.profile)),
+            ),
+          ),
+      ),
+  ],
+  [
+    `date bigint and typed array values`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .where(({ user }) =>
+            and(
+              gte(user.createdAt, new Date(`2024-01-01T00:00:00.000Z`)),
+              gt(user.largeViewCount, 9007199254740993n),
+              eq(user.blob, new Uint8Array([1, 2, 3])),
+            ),
+          ),
+      ),
+  ],
+  [
+    `plain object values`,
+    () =>
+      getQueryIR(
+        new Query().from({ user: usersCollection }).where(({ user }) =>
+          eq(user.profile, {
+            experience: { years: 5 },
+            skills: [`ts`, `db`],
+          }),
+        ),
+      ),
+  ],
+  [
+    `nested select and computed expressions`,
+    () =>
+      getQueryIR(
+        new Query().from({ user: usersCollection }).select(({ user }) => ({
+          id: user.id,
+          displayName: concat(upper(user.name), ` <`, lower(user.email), `>`),
+          score: add(user.salary, 1000),
+          fallbackEmail: coalesce(user.email, `missing@example.com`),
+          meta: {
+            active: user.active,
+            nameLength: length(user.name),
+          },
+        })),
+      ),
+  ],
+  [
+    `conditional projection select`,
+    () =>
+      getQueryIR(
+        new Query().from({ user: usersCollection }).select(({ user }) => ({
+          id: user.id,
+          profile: caseWhen(
+            gt(user.age, 18),
+            {
+              label: `adult`,
+              email: user.email,
+            },
+            {
+              label: `minor`,
+              email: null,
+            },
+          ),
+        })),
+      ),
+  ],
+  [
+    `top-level alias spread select`,
+    () =>
+      getQueryIR(
+        new Query().from({ user: usersCollection }).select(({ user }) => user),
+      ),
+  ],
+  [
+    `locale orderBy options`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .orderBy(({ user }) => user.name, {
+            direction: `asc`,
+            nulls: `last`,
+            stringSort: `locale`,
+            locale: `en-US`,
+            localeOptions: { sensitivity: `base`, numeric: true },
+          }),
+      ),
+  ],
+  [
+    `groupBy aggregates and selected orderBy`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .groupBy(({ user }) => user.teamId)
+          .select(({ user }) => ({
+            teamId: user.teamId,
+            userCount: count(user.id),
+            avgAge: avg(user.age),
+            totalSalary: sum(user.salary),
+            latestSignup: max(user.createdAt),
+          }))
+          .having(({ $selected }) => gt($selected.userCount, 1))
+          .orderBy(({ $selected }) => $selected.avgAge, `desc`),
+      ),
+  ],
+  [
+    `join query`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .join(
+            { post: postsCollection },
+            ({ user, post }) => eq(user.id, post.userId),
+            `left`,
+          )
+          .where(({ post }) => eq(post.published, true))
+          .select(({ user, post }) => ({
+            userId: user.id,
+            postTitle: post.title,
+          })),
+      ),
+  ],
+  [
+    `subquery join`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({
+            post: new Query()
+              .from({ post: postsCollection })
+              .where(({ post }) => gt(post.views, 100)),
+          })
+          .join(
+            {
+              activeUser: new Query()
+                .from({ user: usersCollection })
+                .where(({ user }) => eq(user.status, `active`)),
+            },
+            ({ post, activeUser }) => eq(post.userId, activeUser.id),
+            `inner`,
+          ),
+      ),
+  ],
+  [
+    `unioned source object`,
+    () =>
+      getQueryIR(
+        new Query().unionAll({ user: usersCollection, post: postsCollection }),
+      ),
+  ],
+  [
+    `unioned query branches`,
+    () =>
+      getQueryIR(
+        new Query().unionAll(
+          new Query().from({ user: usersCollection }).select(({ user }) => ({
+            id: user.id,
+            label: user.name,
+          })),
+          new Query().from({ post: postsCollection }).select(({ post }) => ({
+            id: post.id,
+            label: post.title,
+          })),
+        ),
+      ),
+  ],
+  [
+    `includes subquery`,
+    () =>
+      getQueryIR(
+        new Query().from({ user: usersCollection }).select(({ user }) => ({
+          id: user.id,
+          posts: new Query()
+            .from({ post: postsCollection })
+            .where(({ post }) => eq(post.userId, user.id))
+            .select(({ post }) => ({
+              id: post.id,
+              title: post.title,
+            })),
+        })),
+      ),
+  ],
+  [
+    `pagination shape`,
+    () =>
+      getQueryIR(
+        new Query()
+          .from({ post: postsCollection })
+          .where(({ post }) => like(post.title, `%db%`))
+          .orderBy(({ post }) => post.createdAt, `desc`)
+          .offset(20)
+          .limit(10),
+      ),
+  ],
+]
+
+describe(`stable QueryIR identity smoke test`, () => {
+  it(`can derive identity for representative structured query shapes`, () => {
+    expect(structuredQueries).toHaveLength(17)
+
+    const hashes = structuredQueries.map(([name, createQuery]) => {
+      const hash = getStableQueryIRHash(createQuery())
+      expect(hash, name).toContain(`"type":"query"`)
+      expect(() => JSON.parse(hash), name).not.toThrow()
+      return hash
+    })
+
+    expect(new Set(hashes).size).toBe(hashes.length)
+  })
+
+  it(`does not depend on collection object identity when ids match`, () => {
+    const otherUsersCollection = new CollectionImpl<User>({
+      id: `users`,
+      getKey: (item) => item.id,
+      sync: { sync: () => {} },
+    })
+
+    const createQuery = (collection: CollectionImpl<User>) =>
+      getQueryIR(
+        new Query()
+          .from({ user: collection })
+          .where(({ user }) => eq(user.status, `active`)),
+      )
+
+    expect(getStableQueryIRHash(createQuery(usersCollection))).toBe(
+      getStableQueryIRHash(createQuery(otherUsersCollection)),
+    )
+  })
+
+  it(`changes identity when captured structured values change`, () => {
+    const createQuery = (status: User[`status`]) =>
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .where(({ user }) => eq(user.status, status)),
+      )
+
+    expect(getStableQueryIRHash(createQuery(`active`))).not.toBe(
+      getStableQueryIRHash(createQuery(`inactive`)),
+    )
+  })
+
+  it(`normalizes object property ordering inside values`, () => {
+    const left = getQueryIR(
+      new Query().from({ user: usersCollection }).where(({ user }) =>
+        eq(user.profile, {
+          skills: [`ts`, `db`],
+          experience: { years: 5 },
+        }),
+      ),
+    )
+
+    const right = getQueryIR(
+      new Query().from({ user: usersCollection }).where(({ user }) =>
+        eq(user.profile, {
+          experience: { years: 5 },
+          skills: [`ts`, `db`],
+        }),
+      ),
+    )
+
+    expect(getStableQueryIRHash(left)).toBe(getStableQueryIRHash(right))
+  })
+
+  it(`rejects functional query variants`, () => {
+    const queries = [
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .fn.where(({ user }) => user.active),
+      ),
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .fn.select(({ user }) => ({ id: user.id })),
+      ),
+      getQueryIR(
+        new Query()
+          .from({ user: usersCollection })
+          .groupBy(({ user }) => user.teamId)
+          .select(({ user }) => ({
+            teamId: user.teamId,
+            userCount: count(user.id),
+          }))
+          .fn.having(({ $selected }) => $selected.userCount > 1),
+      ),
+    ]
+
+    for (const query of queries) {
+      expect(() => getStableQueryIRHash(query)).toThrow(UnhashableQueryIRError)
+    }
+  })
+
+  it(`rejects opaque runtime values inside otherwise structured expressions`, () => {
+    const circularValue: Record<string, unknown> = {}
+    circularValue.self = circularValue
+
+    class OpaqueValue {
+      value = `Tanner`
+    }
+
+    const queries = [
+      [
+        `function value`,
+        getQueryIR(
+          new Query()
+            .from({ user: usersCollection })
+            .where(({ user }) => eq(user.name, (() => `Tanner`) as never)),
+        ),
+        /function value/,
+      ],
+      [
+        `symbol value`,
+        getQueryIR(
+          new Query()
+            .from({ user: usersCollection })
+            .where(({ user }) => eq(user.name, Symbol(`name`) as never)),
+        ),
+        /symbol value/,
+      ],
+      [
+        `circular value`,
+        getQueryIR(
+          new Query()
+            .from({ user: usersCollection })
+            .where(({ user }) => eq(user.profile, circularValue as never)),
+        ),
+        /circular value/,
+      ],
+      [
+        `invalid date`,
+        getQueryIR(
+          new Query()
+            .from({ user: usersCollection })
+            .where(({ user }) =>
+              eq(user.createdAt, new Date(`invalid`) as never),
+            ),
+        ),
+        /invalid Date/,
+      ],
+      [
+        `class instance`,
+        getQueryIR(
+          new Query()
+            .from({ user: usersCollection })
+            .where(({ user }) => eq(user.name, new OpaqueValue() as never)),
+        ),
+        /non-plain object value/,
+      ],
+    ] as const
+
+    for (const [name, query, message] of queries) {
+      expect(() => getStableQueryIRHash(query), name).toThrow(
+        UnhashableQueryIRError,
+      )
+      expect(() => getStableQueryIRHash(query), name).toThrow(message)
+    }
+  })
+})
diff --git a/packages/react-db/README.md b/packages/react-db/README.md
index 12c86adeff..0e136dfea7 100644
--- a/packages/react-db/README.md
+++ b/packages/react-db/README.md
@@ -1,3 +1,15 @@
 # @tanstack/react-db
 
 React hooks for TanStack DB. See [TanStack/db](https://github.com/TanStack/db) for more details.
+
+```tsx
+import { useLiveQuery } from '@tanstack/react-db'
+
+function TodoList() {
+  const { data: todos } = useLiveQuery({
+    query: (q) => q.from({ todo: todoCollection }),
+  })
+
+  return todos.map((todo) => <div key={todo.id}>{todo.text}</div>)
+}
+```
diff --git a/packages/react-db/skills/react-db/SKILL.md b/packages/react-db/skills/react-db/SKILL.md
index fb864ac8f7..ce6a57e0ff 100644
--- a/packages/react-db/skills/react-db/SKILL.md
+++ b/packages/react-db/skills/react-db/SKILL.md
@@ -1,9 +1,10 @@
 ---
 name: react-db
 description: >
-  React bindings for TanStack DB. useLiveQuery hook with dependency arrays
-  (8 overloads: query function, config object, pre-created collection,
-  disabled state via returning undefined/null). useLiveSuspenseQuery for
+  React bindings for TanStack DB. Prefer useLiveQuery({ query }) with
+  derived structured query identity. Provide queryKey only for opaque
+  functional query variants or very hot render paths. Dependency arrays are
+  legacy and warn before 1.0 removal. useLiveSuspenseQuery for
   React Suspense with Error Boundaries (data always defined).
   useLiveInfiniteQuery for cursor-based pagination (pageSize, fetchNextPage,
   hasNextPage, isFetchingNextPage). usePacedMutations for debounced React
@@ -30,15 +31,16 @@ This skill builds on db-core. Read it first for collection setup, query builder,
 ## Setup
 
 ```tsx
-import { useLiveQuery, eq, not } from '@tanstack/react-db'
+import { eq, not, useLiveQuery } from '@tanstack/react-db'
 
 function TodoList() {
-  const { data: todos, isLoading } = useLiveQuery((q) =>
-    q
-      .from({ todo: todoCollection })
-      .where(({ todo }) => not(todo.completed))
-      .orderBy(({ todo }) => todo.created_at, 'asc'),
-  )
+  const { data: todos, isLoading } = useLiveQuery({
+    query: (q) =>
+      q
+        .from({ todo: todoCollection })
+        .where(({ todo }) => not(todo.completed))
+        .orderBy(({ todo }) => todo.created_at, 'asc'),
+  })
 
   if (isLoading) return <div>Loading...</div>
 
@@ -59,7 +61,7 @@ function TodoList() {
 ### useLiveQuery
 
 ```tsx
-// Query function with dependency array
+// Preferred config object with derived query identity
 const {
   data,
   state,
@@ -70,15 +72,14 @@ const {
   isError,
   isIdle,
   isCleanedUp,
-} = useLiveQuery(
-  (q) =>
+} = useLiveQuery({
+  query: (q) =>
     q
       .from({ todo: todoCollection })
       .where(({ todo }) => eq(todo.userId, userId)),
-  [userId],
-)
+})
 
-// Config object
+// Static query
 const { data } = useLiveQuery({
   query: (q) => q.from({ todo: todoCollection }),
   gcTime: 60000,
@@ -87,16 +88,13 @@ const { data } = useLiveQuery({
 // Pre-created collection (from route loader)
 const { data } = useLiveQuery(preloadedCollection)
 
-// Conditional query — return undefined/null to disable
-const { data, status } = useLiveQuery(
-  (q) => {
-    if (!userId) return undefined
-    return q
-      .from({ todo: todoCollection })
-      .where(({ todo }) => eq(todo.userId, userId))
-  },
-  [userId],
-)
+// Conditional query — derived identity handles enabled/disabled transitions
+const { data, status } = useLiveQuery((q) => {
+  if (!userId) return undefined
+  return q
+    .from({ todo: todoCollection })
+    .where(({ todo }) => eq(todo.userId, userId))
+})
 // When disabled: status='disabled', data=undefined
 ```
 
@@ -106,9 +104,9 @@ const { data, status } = useLiveQuery(
 // data is ALWAYS defined — never undefined
 // Must wrap in <Suspense> and <ErrorBoundary>
 function TodoList() {
-  const { data: todos } = useLiveSuspenseQuery((q) =>
-    q.from({ todo: todoCollection }),
-  )
+  const { data: todos } = useLiveSuspenseQuery({
+    query: (q) => q.from({ todo: todoCollection }),
+  })
 
   return (
     <ul>
@@ -119,14 +117,13 @@ function TodoList() {
   )
 }
 
-// With deps — re-suspends when deps change
-const { data } = useLiveSuspenseQuery(
-  (q) =>
+// Structured captured values are part of the derived identity and re-suspend when changed
+const { data } = useLiveSuspenseQuery({
+  query: (q) =>
     q
       .from({ todo: todoCollection })
       .where(({ todo }) => eq(todo.category, category)),
-  [category],
-)
+})
 ```
 
 ### useLiveInfiniteQuery
@@ -137,9 +134,11 @@ const { data, fetchNextPage, hasNextPage, isFetchingNextPage } =
     (q) =>
       q
         .from({ posts: postsCollection })
+        .where(({ posts }) => eq(posts.category, category))
         .orderBy(({ posts }) => posts.createdAt, 'desc'),
-    { pageSize: 20 },
-    [category],
+    {
+      pageSize: 20,
+    },
   )
 
 // data is the flat array of all loaded pages
@@ -174,16 +173,17 @@ When a query uses includes (subqueries in `select`), each child field is a live
 
 ```tsx
 function ProjectList() {
-  const { data: projects } = useLiveQuery((q) =>
-    q.from({ p: projectsCollection }).select(({ p }) => ({
-      id: p.id,
-      name: p.name,
-      issues: q
-        .from({ i: issuesCollection })
-        .where(({ i }) => eq(i.projectId, p.id))
-        .select(({ i }) => ({ id: i.id, title: i.title })),
-    })),
-  )
+  const { data: projects } = useLiveQuery({
+    query: (q) =>
+      q.from({ p: projectsCollection }).select(({ p }) => ({
+        id: p.id,
+        name: p.name,
+        issues: q
+          .from({ i: issuesCollection })
+          .where(({ i }) => eq(i.projectId, p.id))
+          .select(({ i }) => ({ id: i.id, title: i.title })),
+      })),
+  })
 
   return (
     <ul>
@@ -217,18 +217,19 @@ With `toArray()`, child results are plain arrays and the parent re-renders on ch
 ```tsx
 import { toArray, eq } from '@tanstack/react-db'
 
-const { data: projects } = useLiveQuery((q) =>
-  q.from({ p: projectsCollection }).select(({ p }) => ({
-    id: p.id,
-    name: p.name,
-    issues: toArray(
-      q
-        .from({ i: issuesCollection })
-        .where(({ i }) => eq(i.projectId, p.id))
-        .select(({ i }) => ({ id: i.id, title: i.title })),
-    ),
-  })),
-)
+const { data: projects } = useLiveQuery({
+  query: (q) =>
+    q.from({ p: projectsCollection }).select(({ p }) => ({
+      id: p.id,
+      name: p.name,
+      issues: toArray(
+        q
+          .from({ i: issuesCollection })
+          .where(({ i }) => eq(i.projectId, p.id))
+          .select(({ i }) => ({ id: i.id, title: i.title })),
+      ),
+    })),
+})
 // project.issues is string[] — no subcomponent needed
 ```
 
@@ -246,38 +247,53 @@ Live query results include computed, read-only virtual properties on every row:
 These props are added automatically and can be used in `where`, `select`, and `orderBy` clauses. Do not persist them back to storage.
 
 ```tsx
-const { data } = useLiveQuery(
-  (q) =>
+const { data } = useLiveQuery({
+  query: (q) =>
     q
       .from({ todo: todoCollection })
       .where(({ todo }) => eq(todo.$synced, false)),
-  [],
-)
+})
 // Shows only optimistic (unconfirmed) todos
 ```
 
 ## React-Specific Patterns
 
-### Dependency arrays
+### Query identity
 
 ```tsx
-// Include ALL external reactive values
-const { data } = useLiveQuery(
-  (q) =>
+// Structured captured values are included in the derived identity
+const { data } = useLiveQuery({
+  query: (q) =>
     q
       .from({ todo: todoCollection })
       .where(({ todo }) =>
         and(eq(todo.userId, userId), eq(todo.status, filter)),
       ),
-  [userId, filter],
-)
+})
+
+// Static query
+const { data } = useLiveQuery({
+  query: (q) => q.from({ todo: todoCollection }),
+})
+```
 
-// Empty array = static query, never re-runs
-const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }), [])
+Use `queryKey` only when DB cannot derive identity from structured IR, such as
+`.fn.where`, `.fn.select`, `.fn.having`, or as a deliberate performance escape
+hatch on a hot render path:
 
-// No array = re-runs on every render (usually wrong)
+```tsx
+const { data } = useLiveQuery({
+  queryKey: [todoCollection.id, 'search', search],
+  query: (q) =>
+    q.from({ todo: todoCollection }).fn.where(({ todo }) => {
+      return fuzzyMatch(todo.title, search)
+    }),
+})
 ```
 
+In development, opaque IR throws and tells the user to add `queryKey`. Slow or
+repeated derived identity work warns once and points to the same escape hatch.
+
 ### Suspense + Error Boundary
 
 ```tsx
@@ -295,36 +311,42 @@ const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }), [])
 await todoCollection.preload()
 
 // In component — data available immediately:
-const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }))
+const { data } = useLiveQuery({
+  query: (q) => q.from({ todo: todoCollection }),
+})
 ```
 
 See meta-framework/SKILL.md for full preloading patterns.
 
 ## Common Mistakes
 
-### CRITICAL Missing external values in dependency array
+### CRITICAL Using opaque query logic without queryKey
 
 Wrong:
 
 ```tsx
-const { data } = useLiveQuery((q) =>
-  q.from({ todo: todoCollection }).where(({ todo }) => eq(todo.userId, userId)),
-)
+const { data } = useLiveQuery({
+  query: (q) =>
+    q.from({ todo: todoCollection }).fn.where(({ todo }) => {
+      return fuzzyMatch(todo.title, search)
+    }),
+})
 ```
 
 Correct:
 
 ```tsx
-const { data } = useLiveQuery(
-  (q) =>
-    q
-      .from({ todo: todoCollection })
-      .where(({ todo }) => eq(todo.userId, userId)),
-  [userId],
-)
+const { data } = useLiveQuery({
+  queryKey: [todoCollection.id, 'search', search],
+  query: (q) =>
+    q.from({ todo: todoCollection }).fn.where(({ todo }) => {
+      return fuzzyMatch(todo.title, search)
+    }),
+})
 ```
 
-When the query uses external state not in the deps array, the query won't re-run when that value changes, showing stale results.
+Structured expressions are hashable by default. Functional query variants are
+opaque runtime code, so they need an explicit key to say when identity changes.
 
 Source: docs/framework/react/overview.md
 
diff --git a/packages/react-db/src/DbProvider.tsx b/packages/react-db/src/DbProvider.tsx
new file mode 100644
index 0000000000..b048844563
--- /dev/null
+++ b/packages/react-db/src/DbProvider.tsx
@@ -0,0 +1,30 @@
+import { createContext, useContext } from 'react'
+import type { DbClient } from '@tanstack/db'
+import type { ReactNode } from 'react'
+
+const DbContext = createContext<DbClient | undefined>(undefined)
+
+export type DbProviderProps = {
+  client: DbClient
+  children?: ReactNode
+}
+
+export function DbProvider(props: DbProviderProps) {
+  return (
+    <DbContext.Provider value={props.client}>
+      {props.children}
+    </DbContext.Provider>
+  )
+}
+
+export function useDbClient(): DbClient {
+  const client = useContext(DbContext)
+  if (!client) {
+    throw new Error(`useDbClient must be used within a DbProvider.`)
+  }
+  return client
+}
+
+export function useOptionalDbClient(): DbClient | undefined {
+  return useContext(DbContext)
+}
diff --git a/packages/react-db/src/index.ts b/packages/react-db/src/index.ts
index 96db7e2796..4683db0583 100644
--- a/packages/react-db/src/index.ts
+++ b/packages/react-db/src/index.ts
@@ -1,5 +1,6 @@
 // Re-export all public APIs
 export * from './useLiveQuery'
+export * from './DbProvider'
 export * from './useLiveSuspenseQuery'
 export * from './usePacedMutations'
 export * from './useLiveInfiniteQuery'
diff --git a/packages/react-db/src/useLiveInfiniteQuery.ts b/packages/react-db/src/useLiveInfiniteQuery.ts
index 99c77c7397..82c33e76be 100644
--- a/packages/react-db/src/useLiveInfiniteQuery.ts
+++ b/packages/react-db/src/useLiveInfiniteQuery.ts
@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { CollectionImpl } from '@tanstack/db'
 import { useLiveQuery } from './useLiveQuery'
+import type { LiveQueryKey } from './useLiveQuery'
 import type {
   Collection,
   Context,
@@ -21,6 +22,12 @@ function isLiveQueryCollectionUtils(
 }
 
 export type UseLiveInfiniteQueryConfig<TContext extends Context> = {
+  /**
+   * Explicit identity for queries that contain opaque functional variants or
+   * are hot enough that deriving identity from structured IR is too expensive.
+   * Structured queries should omit this so DB can derive identity directly.
+   */
+  queryKey?: LiveQueryKey
   pageSize?: number
   initialPageParam?: number
   /**
@@ -56,7 +63,7 @@ export type UseLiveInfiniteQueryReturn<TContext extends Context> = Omit<
  *
  * @param queryFn - Query function that defines what data to fetch. Must include `.orderBy()` for setWindow to work.
  * @param config - Configuration including pageSize and getNextPageParam
- * @param deps - Array of dependencies that trigger query re-execution when changed
+ * @param deps - Deprecated array of dependencies that trigger query re-execution when changed
  * @returns Object with pages, data, and pagination controls
  *
  * @example
@@ -77,7 +84,7 @@ export type UseLiveInfiniteQueryReturn<TContext extends Context> = Omit<
  * )
  *
  * @example
- * // With dependencies
+ * // With values that recreate the query
  * const { pages, fetchNextPage } = useLiveInfiniteQuery(
  *   (q) => q
  *     .from({ posts: postsCollection })
@@ -87,8 +94,7 @@ export type UseLiveInfiniteQueryReturn<TContext extends Context> = Omit<
  *     pageSize: 10,
  *     getNextPageParam: (lastPage) =>
  *       lastPage.length === 10 ? lastPage.length : undefined
- *   },
- *   [category]
+ *   }
  * )
  *
  * @example
@@ -135,10 +141,11 @@ export function useLiveInfiniteQuery<TContext extends Context>(
 export function useLiveInfiniteQuery<TContext extends Context>(
   queryFnOrCollection: any,
   config: UseLiveInfiniteQueryConfig<TContext>,
-  deps: Array<unknown> = [],
+  deps?: Array<unknown>,
 ): UseLiveInfiniteQueryReturn<TContext> {
   const pageSize = config.pageSize || 20
   const initialPageParam = config.initialPageParam ?? 0
+  const identityDeps = config.queryKey ?? deps ?? []
 
   // Detect if input is a collection or query function
   const isCollection = queryFnOrCollection instanceof CollectionImpl
@@ -159,18 +166,45 @@ export function useLiveInfiniteQuery<TContext extends Context>(
   const collectionRef = useRef(isCollection ? queryFnOrCollection : null)
   const hasValidatedCollectionRef = useRef(false)
 
-  // Track deps for query functions (stringify for comparison)
+  // Track query identity for query functions (stringify for comparison)
   let depsKey: string
   try {
-    depsKey = JSON.stringify(deps)
+    depsKey = JSON.stringify(identityDeps)
   } catch {
     throw new Error(
-      `useLiveInfiniteQuery: dependency array contains values that cannot be serialized (e.g. circular references). ` +
-        `Ensure all dependency values are JSON-serializable.`,
+      `useLiveInfiniteQuery: queryKey/dependency array contains values that cannot be serialized (e.g. circular references). ` +
+        `Ensure all identity values are JSON-serializable.`,
     )
   }
   const prevDepsKeyRef = useRef(depsKey)
 
+  // Create a live query with initial limit and offset
+  // Either pass collection directly or wrap query function
+  // Use pageSize + 1 for peek-ahead detection (to know if there are more pages)
+  const queryResult = isCollection
+    ? useLiveQuery(queryFnOrCollection)
+    : config.queryKey
+      ? useLiveQuery({
+          queryKey: config.queryKey,
+          query: (q) =>
+            queryFnOrCollection(q)
+              .limit(pageSize + 1)
+              .offset(0),
+        })
+      : deps === undefined
+        ? useLiveQuery((q) =>
+            queryFnOrCollection(q)
+              .limit(pageSize + 1)
+              .offset(0),
+          )
+        : useLiveQuery(
+            (q) =>
+              queryFnOrCollection(q)
+                .limit(pageSize + 1)
+                .offset(0),
+            deps,
+          )
+
   // Reset pagination when inputs change
   useEffect(() => {
     let shouldReset = false
@@ -183,30 +217,23 @@ export function useLiveInfiniteQuery<TContext extends Context>(
         shouldReset = true
       }
     } else {
-      // Reset if deps changed (for query functions)
+      // Reset if explicit identity changed
       if (prevDepsKeyRef.current !== depsKey) {
         prevDepsKeyRef.current = depsKey
         shouldReset = true
       }
+
+      // Reset if derived query identity changed and useLiveQuery rebuilt the collection
+      if (collectionRef.current !== queryResult.collection) {
+        collectionRef.current = queryResult.collection
+        shouldReset = true
+      }
     }
 
     if (shouldReset) {
       setLoadedPageCount(1)
     }
-  }, [isCollection, queryFnOrCollection, depsKey])
-
-  // Create a live query with initial limit and offset
-  // Either pass collection directly or wrap query function
-  // Use pageSize + 1 for peek-ahead detection (to know if there are more pages)
-  const queryResult = isCollection
-    ? useLiveQuery(queryFnOrCollection)
-    : useLiveQuery(
-        (q) =>
-          queryFnOrCollection(q)
-            .limit(pageSize + 1)
-            .offset(0),
-        deps,
-      )
+  }, [isCollection, queryFnOrCollection, depsKey, queryResult.collection])
 
   // Adjust window when pagination changes
   useEffect(() => {
diff --git a/packages/react-db/src/useLiveQuery.ts b/packages/react-db/src/useLiveQuery.ts
index 331ff3a279..2c93466136 100644
--- a/packages/react-db/src/useLiveQuery.ts
+++ b/packages/react-db/src/useLiveQuery.ts
@@ -2,13 +2,19 @@ import { useRef, useSyncExternalStore } from 'react'
 import {
   BaseQueryBuilder,
   CollectionImpl,
+  UnhashableQueryIRError,
   createLiveQueryCollection,
+  deepEquals,
+  getStableQueryBuilderHash,
 } from '@tanstack/db'
+import { useOptionalDbClient } from './DbProvider'
 import type {
   Collection,
   CollectionConfigSingleRowOption,
+  CollectionOptions,
   CollectionStatus,
   Context,
+  DbClient,
   GetResult,
   InferResultType,
   InitialQueryBuilder,
@@ -19,57 +25,282 @@ import type {
 } from '@tanstack/db'
 
 const DEFAULT_GC_TIME_MS = 1 // Live queries created by useLiveQuery are cleaned up immediately (0 disables GC)
+const DERIVED_IDENTITY_SINGLE_RENDER_WARN_MS = 16
+const DERIVED_IDENTITY_RENDER_COUNT_WARN_THRESHOLD = 10
+const DERIVED_IDENTITY_TOTAL_WARN_MS = 50
+const warnedDepsCallsites = new Set<string>()
+const warnedDerivedIdentityCallsites = new Set<string>()
+
+type DerivedIdentityProfiler = {
+  renderCount: number
+  totalMs: number
+  maxMs: number
+  warned: boolean
+}
 
 export type UseLiveQueryStatus = CollectionStatus | `disabled`
+export type LiveQueryKey = ReadonlyArray<unknown>
+export type UseLiveQueryConfig<TContext extends Context> =
+  LiveQueryCollectionConfig<TContext> & {
+    /**
+     * Explicit identity for queries that contain opaque functional variants or
+     * are hot enough that deriving identity from structured IR is too expensive.
+     * Structured queries should omit this so DB can derive identity directly.
+     */
+    queryKey?: LiveQueryKey
+  }
+
+function warnDeprecatedDepsArray(): void {
+  if (!shouldWarnInDevelopment(`TANSTACK_DB_DISABLE_DEPRECATION_WARNINGS`)) {
+    return
+  }
+
+  const callsite = getWarningCallsite(4)
+  if (warnedDepsCallsites.has(callsite)) {
+    return
+  }
+  warnedDepsCallsites.add(callsite)
+  console.warn(
+    `[useLiveQuery] The dependency-array form useLiveQuery(query, deps) is deprecated and will be removed in 1.0. Use useLiveQuery({ query }) instead. Provide queryKey only for functional/opaque queries or to avoid deriving identity from structured query IR on render.`,
+  )
+}
+
+function shouldWarnInDevelopment(disableEnvVar: string): boolean {
+  if (typeof process === `undefined`) {
+    return true
+  }
+
+  return (
+    process.env.NODE_ENV !== `production` && process.env[disableEnvVar] !== `1`
+  )
+}
+
+function getCurrentTime(): number {
+  return typeof performance !== `undefined` &&
+    typeof performance.now === `function`
+    ? performance.now()
+    : Date.now()
+}
+
+function getWarningCallsite(stackIndex: number): string {
+  const stack = new Error().stack ?? `unknown`
+  return stack.split(`\n`)[stackIndex]?.trim() ?? stack
+}
+
+function warnDerivedIdentityHotPath(
+  profiler: DerivedIdentityProfiler,
+  durationMs: number,
+): void {
+  if (
+    profiler.warned ||
+    !shouldWarnInDevelopment(`TANSTACK_DB_DISABLE_QUERY_IDENTITY_WARNINGS`)
+  ) {
+    return
+  }
+
+  const isSlowSingleRender =
+    durationMs >= DERIVED_IDENTITY_SINGLE_RENDER_WARN_MS
+  const isHotRenderPath =
+    profiler.renderCount >= DERIVED_IDENTITY_RENDER_COUNT_WARN_THRESHOLD &&
+    profiler.totalMs >= DERIVED_IDENTITY_TOTAL_WARN_MS
+
+  if (!isSlowSingleRender && !isHotRenderPath) {
+    return
+  }
+
+  const callsite = getWarningCallsite(5)
+  if (warnedDerivedIdentityCallsites.has(callsite)) {
+    profiler.warned = true
+    return
+  }
+
+  warnedDerivedIdentityCallsites.add(callsite)
+  profiler.warned = true
+
+  const reason = isSlowSingleRender
+    ? `one render took ${durationMs.toFixed(1)}ms`
+    : `${profiler.renderCount} renders took ${profiler.totalMs.toFixed(1)}ms`
+
+  console.warn(
+    `[useLiveQuery] Deriving live query identity from structured query IR is running on a hot render path (${reason}, max ${profiler.maxMs.toFixed(1)}ms). ` +
+      `Provide an explicit queryKey to skip rebuilding and hashing the IR on every render: useLiveQuery({ queryKey: [...], query }).`,
+  )
+}
+
+function createInitialQueryBuilder(dbClient: DbClient | undefined) {
+  return new BaseQueryBuilder(
+    {},
+    dbClient
+      ? (options: CollectionOptions<any, string | number, any, any>) =>
+          dbClient.collection(options as any) as CollectionImpl<
+            any,
+            string | number,
+            any,
+            any,
+            any
+          >
+      : undefined,
+  ) as InitialQueryBuilder
+}
+
+function resolveQueryWithDbClient<TContext extends Context>(
+  query: LiveQueryCollectionConfig<TContext>[`query`],
+  dbClient: DbClient | undefined,
+): LiveQueryCollectionConfig<TContext>[`query`] {
+  if (typeof query !== `function`) {
+    return query
+  }
+
+  const resolvedQuery = (_: InitialQueryBuilder) =>
+    query(createInitialQueryBuilder(dbClient))
+
+  return resolvedQuery as LiveQueryCollectionConfig<TContext>[`query`]
+}
+
+function resolveConfigWithDbClient<TContext extends Context>(
+  config: LiveQueryCollectionConfig<TContext>,
+  dbClient: DbClient | undefined,
+): LiveQueryCollectionConfig<TContext> {
+  return {
+    ...config,
+    query: resolveQueryWithDbClient(config.query, dbClient),
+  }
+}
+
+function getExplicitQueryKey(value: unknown): LiveQueryKey | undefined {
+  return value &&
+    typeof value === `object` &&
+    Array.isArray((value as { queryKey?: unknown }).queryKey)
+    ? (value as { queryKey: LiveQueryKey }).queryKey
+    : undefined
+}
+
+function getDerivedQueryIdentity(
+  value: unknown,
+  dbClient: DbClient | undefined,
+  profiler: DerivedIdentityProfiler,
+): Array<unknown> {
+  const shouldProfile = shouldWarnInDevelopment(
+    `TANSTACK_DB_DISABLE_QUERY_IDENTITY_WARNINGS`,
+  )
+  const start = shouldProfile ? getCurrentTime() : 0
+
+  let identity: unknown
+  try {
+    identity = deriveQueryIdentity(value, dbClient)
+  } catch (error) {
+    if (error instanceof UnhashableQueryIRError) {
+      throw new Error(
+        `[useLiveQuery] This query cannot derive a stable identity from its structured IR because ${error.reason} at ${error.path}. ` +
+          `Provide an explicit queryKey: useLiveQuery({ queryKey: [...], query }).`,
+      )
+    }
+
+    throw error
+  }
+
+  if (shouldProfile) {
+    const durationMs = getCurrentTime() - start
+    profiler.renderCount += 1
+    profiler.totalMs += durationMs
+    profiler.maxMs = Math.max(profiler.maxMs, durationMs)
+    warnDerivedIdentityHotPath(profiler, durationMs)
+  }
+
+  return [`derived`, identity]
+}
+
+function deriveQueryIdentity(
+  value: unknown,
+  dbClient: DbClient | undefined,
+): unknown {
+  if (typeof value === `function`) {
+    const result = value(createInitialQueryBuilder(dbClient))
+    return deriveQueryResultIdentity(result, dbClient)
+  }
+
+  if (value instanceof CollectionImpl) {
+    return [`collection`, value.id]
+  }
+
+  if (value instanceof BaseQueryBuilder) {
+    return [`query`, getStableQueryBuilderHash(value)]
+  }
+
+  if (value && typeof value === `object` && `query` in value) {
+    const config = value as LiveQueryCollectionConfig<any>
+    return [
+      `config`,
+      deriveQueryIdentity(
+        resolveQueryWithDbClient(config.query, dbClient),
+        dbClient,
+      ),
+    ]
+  }
+
+  return [`value`, value]
+}
+
+function deriveQueryResultIdentity(
+  result: unknown,
+  dbClient: DbClient | undefined,
+): unknown {
+  if (result === undefined || result === null) {
+    return [`disabled`]
+  }
+
+  return deriveQueryIdentity(result, dbClient)
+}
 
 /**
- * Create a live query using a query function
+ * Create a live query using a query function.
  * @param queryFn - Query function that defines what data to fetch
- * @param deps - Array of dependencies that trigger query re-execution when changed
+ * @param deps - Deprecated array of dependencies that trigger query re-execution when changed
  * @returns Object with reactive data, state, and status information
  * @example
- * // Basic query with object syntax
- * const { data, isLoading } = useLiveQuery((q) =>
- *   q.from({ todos: todosCollection })
- *    .where(({ todos }) => eq(todos.completed, false))
- *    .select(({ todos }) => ({ id: todos.id, text: todos.text }))
- * )
+ * // Prefer config object syntax
+ * const { data, isLoading } = useLiveQuery({
+ *   query: (q) =>
+ *     q.from({ todos: todosCollection })
+ *      .where(({ todos }) => eq(todos.completed, false))
+ *      .select(({ todos }) => ({ id: todos.id, text: todos.text }))
+ * })
  *
  *  @example
  * // Single result query
- * const { data } = useLiveQuery(
- *   (q) => q.from({ todos: todosCollection })
+ * const { data } = useLiveQuery({
+ *   query: (q) => q.from({ todos: todosCollection })
  *          .where(({ todos }) => eq(todos.id, 1))
  *          .findOne()
- * )
+ * })
  *
  * @example
- * // With dependencies that trigger re-execution
- * const { data, state } = useLiveQuery(
- *   (q) => q.from({ todos: todosCollection })
+ * // Structured captured values are included in derived query identity
+ * const { data, state } = useLiveQuery({
+ *   query: (q) => q.from({ todos: todosCollection })
  *          .where(({ todos }) => gt(todos.priority, minPriority)),
- *   [minPriority] // Re-run when minPriority changes
- * )
+ * })
  *
  * @example
  * // Join pattern
- * const { data } = useLiveQuery((q) =>
- *   q.from({ issues: issueCollection })
- *    .join({ persons: personCollection }, ({ issues, persons }) =>
- *      eq(issues.userId, persons.id)
- *    )
- *    .select(({ issues, persons }) => ({
- *      id: issues.id,
- *      title: issues.title,
- *      userName: persons.name
- *    }))
- * )
+ * const { data } = useLiveQuery({
+ *   query: (q) =>
+ *     q.from({ issues: issueCollection })
+ *      .join({ persons: personCollection }, ({ issues, persons }) =>
+ *        eq(issues.userId, persons.id)
+ *      )
+ *      .select(({ issues, persons }) => ({
+ *        id: issues.id,
+ *        title: issues.title,
+ *        userName: persons.name
+ *      }))
+ * })
  *
  * @example
  * // Handle loading and error states
- * const { data, isLoading, isError, status } = useLiveQuery((q) =>
- *   q.from({ todos: todoCollection })
- * )
+ * const { data, isLoading, isError, status } = useLiveQuery({
+ *   query: (q) => q.from({ todos: todoCollection })
+ * })
  *
  * if (isLoading) return <div>Loading...</div>
  * if (isError) return <div>Error: {status}</div>
@@ -196,7 +427,7 @@ export function useLiveQuery<
 /**
  * Create a live query using configuration object
  * @param config - Configuration object with query and options
- * @param deps - Array of dependencies that trigger query re-execution when changed
+ * @param deps - Deprecated array of dependencies that trigger query re-execution when changed
  * @returns Object with reactive data, state, and status information
  * @example
  * // Basic config object usage
@@ -212,7 +443,9 @@ export function useLiveQuery<
  *   .where(({ persons }) => gt(persons.age, 30))
  *   .select(({ persons }) => ({ id: persons.id, name: persons.name }))
  *
- * const { data, isReady } = useLiveQuery({ query: queryBuilder })
+ * const { data, isReady } = useLiveQuery({
+ *   query: queryBuilder,
+ * })
  *
  * @example
  * // Handle all states uniformly
@@ -227,6 +460,22 @@ export function useLiveQuery<
  * return <div>{data.length} items loaded</div>
  */
 // Overload 6: Accept config object
+export function useLiveQuery<TContext extends Context>(
+  config: UseLiveQueryConfig<TContext>,
+): {
+  state: Map<string | number, GetResult<TContext>>
+  data: InferResultType<TContext>
+  collection: Collection<GetResult<TContext>, string | number, {}>
+  status: CollectionStatus // Can't be disabled for config objects
+  isLoading: boolean
+  isReady: boolean
+  isIdle: boolean
+  isError: boolean
+  isCleanedUp: boolean
+  isEnabled: true // Always true for config objects
+}
+
+// Overload 7: Accept config object with legacy deps
 export function useLiveQuery<TContext extends Context>(
   config: LiveQueryCollectionConfig<TContext>,
   deps?: Array<unknown>,
@@ -272,7 +521,7 @@ export function useLiveQuery<TContext extends Context>(
  *
  * return <div>{data.map(item => <Item key={item.id} {...item} />)}</div>
  */
-// Overload 7: Accept pre-created live query collection
+// Overload 8: Accept pre-created live query collection
 export function useLiveQuery<
   TResult extends object,
   TKey extends string | number,
@@ -292,7 +541,7 @@ export function useLiveQuery<
   isEnabled: true // Always true for pre-created live query collections
 }
 
-// Overload 8: Accept pre-created live query collection with singleResult: true
+// Overload 9: Accept pre-created live query collection with singleResult: true
 export function useLiveQuery<
   TResult extends object,
   TKey extends string | number,
@@ -315,8 +564,10 @@ export function useLiveQuery<
 // Implementation - use function overloads to infer the actual collection type
 export function useLiveQuery(
   configOrQueryOrCollection: any,
-  deps: Array<unknown> = [],
+  deps?: Array<unknown>,
 ) {
+  const dbClient = useOptionalDbClient()
+  const resolvedDeps = deps ?? []
   // Check if it's already a collection by checking for specific collection methods
   const isCollection =
     configOrQueryOrCollection &&
@@ -338,15 +589,38 @@ export function useLiveQuery(
     collection: Collection<object, string | number, {}> | null
     version: number
   } | null>(null)
+  const derivedIdentityProfilerRef = useRef<DerivedIdentityProfiler>({
+    renderCount: 0,
+    totalMs: 0,
+    maxMs: 0,
+    warned: false,
+  })
+
+  const queryKey = !isCollection
+    ? getExplicitQueryKey(configOrQueryOrCollection)
+    : undefined
+  const identityDeps =
+    queryKey ??
+    (deps !== undefined
+      ? resolvedDeps
+      : isCollection
+        ? []
+        : getDerivedQueryIdentity(
+            configOrQueryOrCollection,
+            dbClient,
+            derivedIdentityProfilerRef.current,
+          ))
+
+  if (deps !== undefined) {
+    warnDeprecatedDepsArray()
+  }
 
   // Check if we need to create/recreate the collection
   const needsNewCollection =
     !collectionRef.current ||
     (isCollection && configRef.current !== configOrQueryOrCollection) ||
     (!isCollection &&
-      (depsRef.current === null ||
-        depsRef.current.length !== deps.length ||
-        depsRef.current.some((dep, i) => dep !== deps[i])))
+      (depsRef.current === null || !deepEquals(depsRef.current, identityDeps)))
 
   if (needsNewCollection) {
     if (isCollection) {
@@ -361,7 +635,7 @@ export function useLiveQuery(
           `[useLiveQuery] Warning: Passing a collection with syncMode "on-demand" directly to useLiveQuery ` +
             `will not load any data. In on-demand mode, data is only loaded when queries with predicates request it.\n\n` +
             `Instead, use a query builder function:\n` +
-            `  const { data } = useLiveQuery((q) => q.from({ c: myCollection }).select(({ c }) => c))\n\n` +
+            `  const { data } = useLiveQuery({ query: (q) => q.from({ c: myCollection }).select(({ c }) => c) })\n\n` +
             `Or switch to syncMode "eager" if you want all data to sync automatically.`,
         )
       }
@@ -373,7 +647,7 @@ export function useLiveQuery(
       // Handle different callback return types
       if (typeof configOrQueryOrCollection === `function`) {
         // Call the function with a query builder to see what it returns
-        const queryBuilder = new BaseQueryBuilder() as InitialQueryBuilder
+        const queryBuilder = createInitialQueryBuilder(dbClient)
         const result = configOrQueryOrCollection(queryBuilder)
 
         if (result === undefined || result === null) {
@@ -387,32 +661,41 @@ export function useLiveQuery(
           // Callback returned QueryBuilder - create live query collection using the original callback
           // (not the result, since the result might be from a different query builder instance)
           collectionRef.current = createLiveQueryCollection({
-            query: configOrQueryOrCollection,
+            query: resolveQueryWithDbClient(
+              configOrQueryOrCollection,
+              dbClient,
+            ),
             startSync: true,
             gcTime: DEFAULT_GC_TIME_MS,
           })
         } else if (result && typeof result === `object`) {
           // Assume it's a LiveQueryCollectionConfig
-          collectionRef.current = createLiveQueryCollection({
+          const config = {
             startSync: true,
             gcTime: DEFAULT_GC_TIME_MS,
             ...result,
-          })
+          } as LiveQueryCollectionConfig<any>
+          collectionRef.current = createLiveQueryCollection(
+            resolveConfigWithDbClient(config, dbClient) as any,
+          )
         } else {
           // Unexpected return type
           throw new Error(
             `useLiveQuery callback must return a QueryBuilder, LiveQueryCollectionConfig, Collection, undefined, or null. Got: ${typeof result}`,
           )
         }
-        depsRef.current = [...deps]
+        depsRef.current = [...identityDeps]
       } else {
         // Original logic for config objects
-        collectionRef.current = createLiveQueryCollection({
+        const config = {
           startSync: true,
           gcTime: DEFAULT_GC_TIME_MS,
           ...configOrQueryOrCollection,
-        })
-        depsRef.current = [...deps]
+        } as LiveQueryCollectionConfig<any>
+        collectionRef.current = createLiveQueryCollection(
+          resolveConfigWithDbClient(config, dbClient) as any,
+        )
+        depsRef.current = [...identityDeps]
       }
     }
   }
@@ -483,6 +766,7 @@ export function useLiveQuery(
   const snapshot = useSyncExternalStore(
     subscribeRef.current,
     getSnapshotRef.current,
+    getSnapshotRef.current,
   )
 
   // Track last snapshot (from useSyncExternalStore) and the returned value separately
diff --git a/packages/react-db/src/useLiveSuspenseQuery.ts b/packages/react-db/src/useLiveSuspenseQuery.ts
index 162bf1f3fe..e51b62e917 100644
--- a/packages/react-db/src/useLiveSuspenseQuery.ts
+++ b/packages/react-db/src/useLiveSuspenseQuery.ts
@@ -1,5 +1,6 @@
 import { useRef } from 'react'
 import { useLiveQuery } from './useLiveQuery'
+import type { UseLiveQueryConfig } from './useLiveQuery'
 import type {
   Collection,
   Context,
@@ -15,18 +16,19 @@ import type {
 /**
  * Create a live query with React Suspense support
  * @param queryFn - Query function that defines what data to fetch
- * @param deps - Array of dependencies that trigger query re-execution when changed
+ * @param deps - Deprecated array of dependencies that trigger query re-execution when changed
  * @returns Object with reactive data and state - data is guaranteed to be defined
  * @throws Promise when data is loading (caught by Suspense boundary)
  * @throws Error when collection fails (caught by Error boundary)
  * @example
  * // Basic usage with Suspense
  * function TodoList() {
- *   const { data } = useLiveSuspenseQuery((q) =>
- *     q.from({ todos: todosCollection })
- *      .where(({ todos }) => eq(todos.completed, false))
- *      .select(({ todos }) => ({ id: todos.id, text: todos.text }))
- *   )
+ *   const { data } = useLiveSuspenseQuery({
+ *     query: (q) =>
+ *       q.from({ todos: todosCollection })
+ *        .where(({ todos }) => eq(todos.completed, false))
+ *        .select(({ todos }) => ({ id: todos.id, text: todos.text }))
+ *   })
  *
  *   return (
  *     <ul>
@@ -53,12 +55,11 @@ import type {
  * // data is guaranteed to be the single item (or undefined if not found)
  *
  * @example
- * // With dependencies that trigger re-suspension
- * const { data } = useLiveSuspenseQuery(
- *   (q) => q.from({ todos: todosCollection })
+ * // Structured captured values are included in derived query identity and trigger re-suspension
+ * const { data } = useLiveSuspenseQuery({
+ *   query: (q) => q.from({ todos: todosCollection })
  *          .where(({ todos }) => gt(todos.priority, minPriority)),
- *   [minPriority] // Re-suspends when minPriority changes
- * )
+ * })
  *
  * @example
  * // With Error boundary
@@ -87,9 +88,9 @@ import type {
  * ✅ **Use conditional rendering instead:**
  * ```ts
  * function Profile({ userId }: { userId: string }) {
- *   const { data } = useLiveSuspenseQuery(
- *     (q) => q.from({ users }).where(({ users }) => eq(users.id, userId))
- *   )
+ *   const { data } = useLiveSuspenseQuery({
+ *     query: (q) => q.from({ users }).where(({ users }) => eq(users.id, userId)),
+ *   })
  *   return <div>{data.name}</div>
  * }
  *
@@ -97,12 +98,9 @@ import type {
  * {userId ? <Profile userId={userId} /> : <div>No user</div>}
  * ```
  *
- * ✅ **Or use useLiveQuery for conditional queries:**
+ * ✅ **For optional inputs, conditionally render a component with complete query inputs:**
  * ```ts
- * const { data, isEnabled } = useLiveQuery(
- *   (q) => userId ? q.from({ users }) : undefined,  // ✅ Supported!
- *   [userId]
- * )
+ * {userId ? <Profile userId={userId} /> : <div>No user</div>}
  * ```
  */
 // Overload 1: Accept query function that always returns QueryBuilder
@@ -116,6 +114,15 @@ export function useLiveSuspenseQuery<TContext extends Context>(
 }
 
 // Overload 2: Accept config object
+export function useLiveSuspenseQuery<TContext extends Context>(
+  config: UseLiveQueryConfig<TContext>,
+): {
+  state: Map<string | number, GetResult<TContext>>
+  data: InferResultType<TContext>
+  collection: Collection<GetResult<TContext>, string | number, {}>
+}
+
+// Overload 3: Accept legacy config object
 export function useLiveSuspenseQuery<TContext extends Context>(
   config: LiveQueryCollectionConfig<TContext>,
   deps?: Array<unknown>,
@@ -125,7 +132,7 @@ export function useLiveSuspenseQuery<TContext extends Context>(
   collection: Collection<GetResult<TContext>, string | number, {}>
 }
 
-// Overload 3: Accept pre-created live query collection
+// Overload 4: Accept pre-created live query collection
 export function useLiveSuspenseQuery<
   TResult extends object,
   TKey extends string | number,
@@ -138,7 +145,7 @@ export function useLiveSuspenseQuery<
   collection: Collection<TResult, TKey, TUtils>
 }
 
-// Overload 4: Accept pre-created live query collection with singleResult: true
+// Overload 5: Accept pre-created live query collection with singleResult: true
 export function useLiveSuspenseQuery<
   TResult extends object,
   TKey extends string | number,
@@ -154,16 +161,19 @@ export function useLiveSuspenseQuery<
 // Implementation - uses useLiveQuery internally and adds Suspense logic
 export function useLiveSuspenseQuery(
   configOrQueryOrCollection: any,
-  deps: Array<unknown> = [],
+  deps?: Array<unknown>,
 ) {
   const promiseRef = useRef<Promise<void> | null>(null)
   const collectionRef = useRef<Collection<any, any, any> | null>(null)
   const hasBeenReadyRef = useRef(false)
 
   // Use useLiveQuery to handle collection management and reactivity
-  const result = useLiveQuery(configOrQueryOrCollection, deps)
+  const result =
+    deps === undefined
+      ? useLiveQuery(configOrQueryOrCollection)
+      : useLiveQuery(configOrQueryOrCollection, deps)
 
-  // Reset promise and ready state when collection changes (deps changed)
+  // Reset promise and ready state when query identity changes
   if (collectionRef.current !== result.collection) {
     promiseRef.current = null
     collectionRef.current = result.collection
diff --git a/packages/react-db/tests/DbProvider.test.tsx b/packages/react-db/tests/DbProvider.test.tsx
new file mode 100644
index 0000000000..59e1a88eb5
--- /dev/null
+++ b/packages/react-db/tests/DbProvider.test.tsx
@@ -0,0 +1,24 @@
+import { describe, expect, it } from 'vitest'
+import { renderHook } from '@testing-library/react'
+import { DbClient } from '@tanstack/db'
+import { DbProvider, useDbClient } from '../src/DbProvider'
+import type { ReactNode } from 'react'
+
+describe(`DbProvider`, () => {
+  it(`provides a DbClient to hooks`, () => {
+    const client = new DbClient()
+    const wrapper = ({ children }: { children: ReactNode }) => (
+      <DbProvider client={client}>{children}</DbProvider>
+    )
+
+    const { result } = renderHook(() => useDbClient(), { wrapper })
+
+    expect(result.current).toBe(client)
+  })
+
+  it(`throws without a provider`, () => {
+    expect(() => renderHook(() => useDbClient())).toThrow(
+      /useDbClient must be used within a DbProvider/,
+    )
+  })
+})
diff --git a/packages/react-db/tests/useLiveQuery.test-d.tsx b/packages/react-db/tests/useLiveQuery.test-d.tsx
index 43747284d8..25f6d74f79 100644
--- a/packages/react-db/tests/useLiveQuery.test-d.tsx
+++ b/packages/react-db/tests/useLiveQuery.test-d.tsx
@@ -1,6 +1,7 @@
 import { describe, expectTypeOf, it } from 'vitest'
 import { renderHook } from '@testing-library/react'
 import { createCollection } from '../../db/src/collection/index'
+import { collectionOptions } from '../../db/src/index'
 import { mockSyncCollectionOptions } from '../../db/tests/utils'
 import {
   createLiveQueryCollection,
@@ -8,6 +9,10 @@ import {
   liveQueryCollectionOptions,
 } from '../../db/src/query/index'
 import { useLiveQuery } from '../src/useLiveQuery'
+import { useLiveInfiniteQuery } from '../src/useLiveInfiniteQuery'
+import { useLiveSuspenseQuery } from '../src/useLiveSuspenseQuery'
+import { useDbClient } from '../src/DbProvider'
+import type { DbClient } from '../../db/src/index'
 import type { OutputWithVirtual } from '../../db/tests/utils'
 import type { SingleResult } from '../../db/src/types'
 
@@ -21,6 +26,11 @@ type Person = {
 }
 
 describe(`useLiveQuery type assertions`, () => {
+  it(`should type useDbClient as DbClient`, () => {
+    const client = useDbClient()
+    expectTypeOf(client).toEqualTypeOf<DbClient>()
+  })
+
   it(`should type findOne query builder to return a single row`, () => {
     const collection = createCollection(
       mockSyncCollectionOptions<Person>({
@@ -68,6 +78,98 @@ describe(`useLiveQuery type assertions`, () => {
     >()
   })
 
+  it(`should type config object to return query rows without queryKey`, () => {
+    const collection = createCollection(
+      mockSyncCollectionOptions<Person>({
+        id: `test-persons-query-key`,
+        getKey: (person: Person) => person.id,
+        initialData: [],
+      }),
+    )
+
+    const { result } = renderHook(() => {
+      return useLiveQuery({
+        query: (q) =>
+          q
+            .from({ collection })
+            .where(({ collection: c }) => eq(c.team, `team-1`)),
+      })
+    })
+
+    expectTypeOf(result.current.data).toMatchTypeOf<
+      Array<OutputWithVirtual<Person>>
+    >()
+  })
+
+  it(`should type collection descriptors in query sources`, () => {
+    const collection = collectionOptions(
+      mockSyncCollectionOptions<Person>({
+        id: `test-persons-descriptor-query-source`,
+        getKey: (person: Person) => person.id,
+        initialData: [],
+      }),
+    )
+
+    const { result } = renderHook(() => {
+      return useLiveQuery({
+        query: (q) =>
+          q
+            .from({ collection })
+            .where(({ collection: c }) => eq(c.team, `team-1`)),
+      })
+    })
+
+    expectTypeOf(result.current.data).toMatchTypeOf<
+      Array<OutputWithVirtual<Person>>
+    >()
+  })
+
+  it(`should type suspense config object to return query rows without queryKey`, () => {
+    const collection = createCollection(
+      mockSyncCollectionOptions<Person>({
+        id: `test-persons-suspense-query-key`,
+        getKey: (person: Person) => person.id,
+        initialData: [],
+      }),
+    )
+
+    const { result } = renderHook(() => {
+      return useLiveSuspenseQuery({
+        query: (q) =>
+          q
+            .from({ collection })
+            .where(({ collection: c }) => eq(c.team, `team-1`)),
+      })
+    })
+
+    expectTypeOf(result.current.data).toMatchTypeOf<
+      Array<OutputWithVirtual<Person>>
+    >()
+  })
+
+  it(`should type infinite config object to return query rows without queryKey`, () => {
+    const collection = createCollection(
+      mockSyncCollectionOptions<Person>({
+        id: `test-persons-infinite-query-key`,
+        getKey: (person: Person) => person.id,
+        initialData: [],
+      }),
+    )
+
+    const { result } = renderHook(() => {
+      return useLiveInfiniteQuery(
+        (q) => q.from({ collection }).orderBy(({ collection: c }) => c.name),
+        {
+          pageSize: 10,
+        },
+      )
+    })
+
+    expectTypeOf(result.current.data).toMatchTypeOf<
+      Array<OutputWithVirtual<Person>>
+    >()
+  })
+
   it(`should type findOne collection using liveQueryCollectionOptions to return a single row`, () => {
     const collection = createCollection(
       mockSyncCollectionOptions<Person>({
diff --git a/packages/react-db/tests/useLiveQuery.test.tsx b/packages/react-db/tests/useLiveQuery.test.tsx
index fbb48d882c..9f389889be 100644
--- a/packages/react-db/tests/useLiveQuery.test.tsx
+++ b/packages/react-db/tests/useLiveQuery.test.tsx
@@ -1,8 +1,10 @@
-import { describe, expect, it } from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 import { act, renderHook, waitFor } from '@testing-library/react'
 import {
+  DbClient,
   Query,
   coalesce,
+  collectionOptions,
   count,
   createCollection,
   createLiveQueryCollection,
@@ -14,10 +16,13 @@ import {
 } from '@tanstack/db'
 import { useEffect } from 'react'
 import { useLiveQuery } from '../src/useLiveQuery'
+import { DbProvider } from '../src/DbProvider'
 import {
   mockSyncCollectionOptions,
   stripVirtualProps,
 } from '../../db/tests/utils'
+import type { DehydratedDbState } from '@tanstack/db'
+import type { ReactNode } from 'react'
 
 type Person = {
   id: string
@@ -1976,7 +1981,7 @@ describe(`Query Collections`, () => {
   })
 
   describe(`callback variants with conditional returns`, () => {
-    it(`should handle callback returning undefined with proper state`, async () => {
+    it(`should handle callback returning undefined without a dependency array`, async () => {
       const collection = createCollection(
         mockSyncCollectionOptions<Person>({
           id: `undefined-callback-test`,
@@ -1987,20 +1992,17 @@ describe(`Query Collections`, () => {
 
       const { result, rerender } = renderHook(
         ({ enabled }: { enabled: boolean }) => {
-          return useLiveQuery(
-            (q) => {
-              if (!enabled) return undefined
-              return q
-                .from({ persons: collection })
-                .where(({ persons }) => gt(persons.age, 30))
-                .select(({ persons }) => ({
-                  id: persons.id,
-                  name: persons.name,
-                  age: persons.age,
-                }))
-            },
-            [enabled],
-          )
+          return useLiveQuery((q) => {
+            if (!enabled) return undefined
+            return q
+              .from({ persons: collection })
+              .where(({ persons }) => gt(persons.age, 30))
+              .select(({ persons }) => ({
+                id: persons.id,
+                name: persons.name,
+                age: persons.age,
+              }))
+          })
         },
         { initialProps: { enabled: false } },
       )
@@ -2056,7 +2058,7 @@ describe(`Query Collections`, () => {
       expect(result.current.isCleanedUp).toBe(false)
     })
 
-    it(`should handle callback returning null with proper state`, async () => {
+    it(`should handle callback returning null without a dependency array`, async () => {
       const collection = createCollection(
         mockSyncCollectionOptions<Person>({
           id: `null-callback-test`,
@@ -2067,20 +2069,17 @@ describe(`Query Collections`, () => {
 
       const { result, rerender } = renderHook(
         ({ enabled }: { enabled: boolean }) => {
-          return useLiveQuery(
-            (q) => {
-              if (!enabled) return null
-              return q
-                .from({ persons: collection })
-                .where(({ persons }) => gt(persons.age, 30))
-                .select(({ persons }) => ({
-                  id: persons.id,
-                  name: persons.name,
-                  age: persons.age,
-                }))
-            },
-            [enabled],
-          )
+          return useLiveQuery((q) => {
+            if (!enabled) return null
+            return q
+              .from({ persons: collection })
+              .where(({ persons }) => gt(persons.age, 30))
+              .select(({ persons }) => ({
+                id: persons.id,
+                name: persons.name,
+                age: persons.age,
+              }))
+          })
         },
         { initialProps: { enabled: false } },
       )
@@ -2604,4 +2603,432 @@ describe(`Query Collections`, () => {
       )
     })
   })
+
+  describe(`SSR hydration`, () => {
+    it(`round-trips collection rows into React and applies streamed chunks incrementally`, async () => {
+      const peopleCollectionId = `ssr-react-people`
+      const peopleCollection = collectionOptions<Person, string>({
+        id: peopleCollectionId,
+        getKey: (person) => person.id,
+        syncMode: `on-demand`,
+        sync: {
+          sync: ({ begin, write, commit, markReady }) => {
+            markReady()
+
+            return {
+              loadSubset: () => {
+                begin({ immediate: true })
+                for (const person of initialPersons) {
+                  write({
+                    type: `insert`,
+                    value: person,
+                  })
+                }
+                commit()
+                return true
+              },
+            }
+          },
+        },
+      })
+      const serverClient = new DbClient()
+      const serverPeople = serverClient.collection(peopleCollection)
+      const serverLiveQuery = createLiveQueryCollection((q) =>
+        q
+          .from({ people: serverPeople })
+          .where(({ people }) => eq(people.team, `team1`)),
+      )
+
+      await serverLiveQuery.preload()
+
+      expect(serverLiveQuery.toArray.map((person) => person.id)).toEqual([
+        `1`,
+        `3`,
+      ])
+      const dehydratedState = serverClient.dehydrate()
+      expect(
+        dehydratedState.collections
+          .flatMap((collection) => collection.rows.map((row) => row.key))
+          .sort(),
+      ).toEqual([`1`, `2`, `3`])
+
+      const transferredState = JSON.parse(
+        JSON.stringify(dehydratedState),
+      ) as DehydratedDbState
+      const clientClient = new DbClient()
+      clientClient.hydrate(transferredState)
+      const wrapper = ({ children }: { children: ReactNode }) => (
+        <DbProvider client={clientClient}>{children}</DbProvider>
+      )
+
+      const { result } = renderHook(
+        () =>
+          useLiveQuery({
+            query: (q) =>
+              q
+                .from({ people: peopleCollection })
+                .where(({ people }) => eq(people.team, `team1`)),
+          }),
+        { wrapper },
+      )
+
+      const resultIds = () => result.current.data.map((person) => person.id)
+
+      await waitFor(() => {
+        expect(resultIds()).toEqual([`1`, `3`])
+      })
+      const hydratedLiveQuery = result.current.collection
+
+      act(() => {
+        clientClient.applyCollectionChunk({
+          collectionId: peopleCollectionId,
+          rows: [
+            {
+              key: `4`,
+              value: {
+                id: `4`,
+                name: `Kyle Doe`,
+                age: 40,
+                email: `kyle.doe@example.com`,
+                isActive: true,
+                team: `team1`,
+              },
+            },
+          ],
+        })
+      })
+
+      await waitFor(() => {
+        expect(resultIds()).toEqual([`1`, `3`, `4`])
+      })
+      expect(result.current.collection).toBe(hydratedLiveQuery)
+    })
+  })
+
+  describe(`derived query identity`, () => {
+    it(`resolves collection descriptors from DbProvider`, async () => {
+      const dbClient = new DbClient()
+      const peopleCollection = collectionOptions(
+        mockSyncCollectionOptions<Person>({
+          id: `descriptor-people`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+      const wrapper = ({ children }: { children: ReactNode }) => (
+        <DbProvider client={dbClient}>{children}</DbProvider>
+      )
+
+      const { result } = renderHook(
+        () =>
+          useLiveQuery({
+            query: (q) =>
+              q
+                .from({ people: peopleCollection })
+                .where(({ people }) => eq(people.team, `team1`)),
+          }),
+        { wrapper },
+      )
+
+      await waitFor(() => {
+        expect(result.current.data).toHaveLength(2)
+      })
+
+      const people = dbClient.collection(peopleCollection)
+
+      act(() => {
+        people.insert({
+          id: `4`,
+          name: `Kyle Doe`,
+          age: 40,
+          email: `kyle.doe@example.com`,
+          isActive: true,
+          team: `team1`,
+        })
+      })
+
+      await waitFor(() => {
+        expect(result.current.data).toHaveLength(3)
+      })
+    })
+
+    it(`keeps the same live query collection when derived identity is stable`, async () => {
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `query-key-stable`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      const { result, rerender } = renderHook(
+        ({ minAge }) =>
+          useLiveQuery({
+            query: (q) =>
+              q
+                .from({ people: collection })
+                .where(({ people }) => gt(people.age, minAge)),
+          }),
+        { initialProps: { minAge: 30 } },
+      )
+
+      await waitFor(() => {
+        expect(result.current.data).toHaveLength(1)
+      })
+      const firstCollection = result.current.collection
+
+      rerender({ minAge: 30 })
+
+      expect(result.current.collection).toBe(firstCollection)
+    })
+
+    it(`recreates the live query collection when derived identity changes`, async () => {
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `query-key-change`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      const { result, rerender } = renderHook(
+        ({ minAge }) =>
+          useLiveQuery({
+            query: (q) =>
+              q
+                .from({ people: collection })
+                .where(({ people }) => gt(people.age, minAge)),
+          }),
+        { initialProps: { minAge: 25 } },
+      )
+
+      await waitFor(() => {
+        expect(result.current.data).toHaveLength(2)
+      })
+      const firstCollection = result.current.collection
+
+      rerender({ minAge: 30 })
+
+      await waitFor(() => {
+        expect(result.current.data).toHaveLength(1)
+      })
+      expect(result.current.collection).not.toBe(firstCollection)
+    })
+
+    it(`throws when a functional query variant cannot derive identity`, () => {
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `derived-identity-functional-missing-key`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      expect(() =>
+        renderHook(
+          ({ minAge }) =>
+            useLiveQuery({
+              query: (q) =>
+                q
+                  .from({ people: collection })
+                  .fn.where(({ people }) => people.age > minAge),
+            }),
+          { initialProps: { minAge: 25 } },
+        ),
+      ).toThrow(/function where at query\.fnWhere/)
+    })
+
+    it(`throws when a structured query captures an opaque runtime value without queryKey`, () => {
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `derived-identity-opaque-value`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      expect(() =>
+        renderHook(() =>
+          useLiveQuery({
+            query: (q) =>
+              q
+                .from({ people: collection })
+                .where(({ people }) =>
+                  eq(people.name, (() => `John Doe`) as never),
+                ),
+          }),
+        ),
+      ).toThrow(/function value at query\.where\[0\]\.args\[1\]\.value/)
+    })
+
+    it(`uses explicit queryKey for functional query variants`, async () => {
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `derived-identity-functional-explicit-key`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      const { result, rerender } = renderHook(
+        ({ minAge }) =>
+          useLiveQuery({
+            queryKey: [collection.id, `fn`, minAge],
+            query: (q) =>
+              q
+                .from({ people: collection })
+                .fn.where(({ people }) => people.age > minAge),
+          }),
+        { initialProps: { minAge: 25 } },
+      )
+
+      await waitFor(() => {
+        expect(result.current.data).toHaveLength(2)
+      })
+      const firstCollection = result.current.collection
+
+      rerender({ minAge: 30 })
+
+      await waitFor(() => {
+        expect(result.current.data).toHaveLength(1)
+      })
+      expect(result.current.collection).not.toBe(firstCollection)
+    })
+
+    it(`warns when derived query identity is slow enough to need queryKey`, () => {
+      const warnSpy = vi.spyOn(console, `warn`).mockImplementation(() => {})
+      const nowSpy = vi.spyOn(globalThis.performance, `now`)
+      let currentTime = 0
+      nowSpy.mockImplementation(() => {
+        const value = currentTime
+        currentTime += 20
+        return value
+      })
+
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `derived-identity-slow-warning`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      const { rerender } = renderHook(() =>
+        useLiveQuery({
+          query: (q) =>
+            q
+              .from({ people: collection })
+              .where(({ people }) => gt(people.age, 25)),
+        }),
+      )
+
+      rerender()
+
+      const hotPathWarnings = warnSpy.mock.calls.filter(([message]) =>
+        String(message).includes(`hot render path`),
+      )
+      expect(hotPathWarnings).toHaveLength(1)
+      expect(hotPathWarnings[0]![0]).toContain(`queryKey`)
+
+      nowSpy.mockRestore()
+      warnSpy.mockRestore()
+    })
+
+    it(`warns when repeated derived query identity work accumulates on a hot render path`, () => {
+      const warnSpy = vi.spyOn(console, `warn`).mockImplementation(() => {})
+      const nowSpy = vi.spyOn(globalThis.performance, `now`)
+      let currentTime = 0
+      nowSpy.mockImplementation(() => {
+        const value = currentTime
+        currentTime += 6
+        return value
+      })
+
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `derived-identity-accumulated-warning`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      const { rerender } = renderHook(
+        ({ renderCount }) => {
+          void renderCount
+          return useLiveQuery({
+            query: (q) =>
+              q
+                .from({ people: collection })
+                .where(({ people }) => gt(people.age, 25)),
+          })
+        },
+        { initialProps: { renderCount: 0 } },
+      )
+
+      for (let renderCount = 1; renderCount < 10; renderCount++) {
+        rerender({ renderCount })
+      }
+
+      const hotPathWarnings = warnSpy.mock.calls.filter(([message]) =>
+        String(message).includes(`renders took`),
+      )
+      expect(hotPathWarnings).toHaveLength(1)
+      expect(hotPathWarnings[0]![0]).toContain(`queryKey`)
+
+      nowSpy.mockRestore()
+      warnSpy.mockRestore()
+    })
+
+    it(`warns once for the deprecated dependency-array form`, () => {
+      const warnSpy = vi.spyOn(console, `warn`).mockImplementation(() => {})
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `deps-warning`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      const { rerender } = renderHook(
+        ({ minAge }) =>
+          useLiveQuery(
+            (q) =>
+              q
+                .from({ people: collection })
+                .where(({ people }) => gt(people.age, minAge)),
+            [minAge],
+          ),
+        { initialProps: { minAge: 25 } },
+      )
+
+      rerender({ minAge: 30 })
+      rerender({ minAge: 30 })
+
+      expect(warnSpy).toHaveBeenCalledTimes(1)
+      expect(warnSpy).toHaveBeenCalledWith(
+        expect.stringContaining(`will be removed in 1.0`),
+      )
+
+      warnSpy.mockRestore()
+    })
+
+    it(`warns for an explicitly passed empty dependency array`, () => {
+      const warnSpy = vi.spyOn(console, `warn`).mockImplementation(() => {})
+      const collection = createCollection(
+        mockSyncCollectionOptions<Person>({
+          id: `empty-deps-warning`,
+          getKey: (person: Person) => person.id,
+          initialData: initialPersons,
+        }),
+      )
+
+      renderHook(() => useLiveQuery((q) => q.from({ people: collection }), []))
+
+      expect(warnSpy).toHaveBeenCalledWith(
+        expect.stringContaining(`useLiveQuery({ query })`),
+      )
+
+      warnSpy.mockRestore()
+    })
+  })
 })
diff --git a/packages/react-db/tests/useLiveSuspenseQuery.test.tsx b/packages/react-db/tests/useLiveSuspenseQuery.test.tsx
index fc78b07968..ce7a78d2fe 100644
--- a/packages/react-db/tests/useLiveSuspenseQuery.test.tsx
+++ b/packages/react-db/tests/useLiveSuspenseQuery.test.tsx
@@ -185,7 +185,7 @@ describe(`useLiveSuspenseQuery`, () => {
     })
   })
 
-  it(`should re-suspend when deps change`, async () => {
+  it(`should re-suspend when derived query identity changes`, async () => {
     const collection = createCollection(
       mockSyncCollectionOptions<Person>({
         id: `test-persons-suspense-5`,
@@ -196,13 +196,12 @@ describe(`useLiveSuspenseQuery`, () => {
 
     const { result, rerender } = renderHook(
       ({ minAge }) => {
-        return useLiveSuspenseQuery(
-          (q) =>
+        return useLiveSuspenseQuery({
+          query: (q) =>
             q
               .from({ persons: collection })
               .where(({ persons }) => gt(persons.age, minAge)),
-          [minAge],
-        )
+        })
       },
       {
         wrapper: SuspenseWrapper,
@@ -216,7 +215,7 @@ describe(`useLiveSuspenseQuery`, () => {
     })
     expect(result.current.data[0]?.age).toBe(35)
 
-    // Change deps - age > 20
+    // Change derived identity - age > 20
     rerender({ minAge: 20 })
 
     // Should re-suspend and load new data
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 52ac0bdc7e..9f0d84dd5c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -722,6 +722,49 @@ importers:
         specifier: ^5.1.0
         version: 5.1.0
 
+  examples/react/start-ssr-e2e:
+    dependencies:
+      '@tanstack/react-db':
+        specifier: ^0.1.85
+        version: link:../../../packages/react-db
+      '@tanstack/react-router':
+        specifier: ^1.159.5
+        version: 1.159.5(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
+      '@tanstack/react-start':
+        specifier: ^1.159.5
+        version: 1.159.5(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vite-plugin-solid@2.11.10(@testing-library/jest-dom@6.9.1)(solid-js@1.9.11)(vite@7.3.2(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(sass@1.90.0)(terser@5.44.0)(tsx@4.21.0)(yaml@2.8.1)))(vite@7.3.2(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(sass@1.90.0)(terser@5.44.0)(tsx@4.21.0)(yaml@2.8.1))
+      react:
+        specifier: ^19.2.4
+        version: 19.2.4
+      react-dom:
+        specifier: ^19.2.4
+        version: 19.2.4(react@19.2.4)
+      vite-tsconfig-paths:
+        specifier: ^5.1.4
+        version: 5.1.4(typescript@5.9.3)(vite@7.3.2(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(sass@1.90.0)(terser@5.44.0)(tsx@4.21.0)(yaml@2.8.1))
+    devDependencies:
+      '@playwright/test':
+        specifier: ^1.60.0
+        version: 1.60.0
+      '@types/node':
+        specifier: ^25.2.2
+        version: 25.2.2
+      '@types/react':
+        specifier: ^19.2.13
+        version: 19.2.13
+      '@types/react-dom':
+        specifier: ^19.2.3
+        version: 19.2.3(@types/react@19.2.13)
+      '@vitejs/plugin-react':
+        specifier: ^5.1.3
+        version: 5.1.3(vite@7.3.2(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(sass@1.90.0)(terser@5.44.0)(tsx@4.21.0)(yaml@2.8.1))
+      typescript:
+        specifier: ^5.9.2
+        version: 5.9.3
+      vite:
+        specifier: ^7.3.0
+        version: 7.3.2(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(sass@1.90.0)(terser@5.44.0)(tsx@4.21.0)(yaml@2.8.1)
+
   examples/react/todo:
     dependencies:
       '@tanstack/electric-db-collection':
@@ -4819,6 +4862,11 @@ packages:
     resolution: {integrity: sha512-QNqXyfVS2wm9hweSYD2O7F0G06uurj9kZ96TRQE5Y9hU7+tgdZwIkbAKc5Ocy1HxEY2kuDQa6cQ1WRs/O5LFKA==}
     engines: {node: ^12.20.0 || ^14.18.0 || >=16.0.0}
 
+  '@playwright/test@1.60.0':
+    resolution: {integrity: sha512-O71yZIbAh/PxDMNGns37GHBIfrVkEVyn+AXyIa5dOTfb4/xNvRWV+Vv/NMbNCtODB/pO7vLlF2OTmMVLhmr7Ag==}
+    engines: {node: '>=18'}
+    hasBin: true
+
   '@polka/url@1.0.0-next.29':
     resolution: {integrity: sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww==}
 
@@ -8586,6 +8634,11 @@ packages:
   fs.realpath@1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
 
+  fsevents@2.3.2:
+    resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+
   fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@@ -10701,6 +10754,16 @@ packages:
   pkg-types@1.3.1:
     resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
 
+  playwright-core@1.60.0:
+    resolution: {integrity: sha512-9bW6zvX/m0lEbgTKJ6YppOKx8H3VOPBMOCFh2irXFOT4BbHgrx5hPjwJYLT40Lu+4qtD36qKc/Hn56StUW57IA==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  playwright@1.60.0:
+    resolution: {integrity: sha512-hheHdokM8cdqCb0lcE3s+zT4t4W+vvjpGxsZlDnikarzx8tSzMebh3UiFtgqwFwnTnjYQcsyMF8ei2mCO/tpeA==}
+    engines: {node: '>=18'}
+    hasBin: true
+
   plist@3.1.0:
     resolution: {integrity: sha512-uysumyrvkUX0rX/dEVqt8gC3sTBzd4zoWfLeS29nb53imdaXVvLINYXTI2GNqzaMuvacNx4uJQ8+b3zXR0pkgQ==}
     engines: {node: '>=10.4.0'}
@@ -16466,6 +16529,10 @@ snapshots:
 
   '@pkgr/core@0.2.9': {}
 
+  '@playwright/test@1.60.0':
+    dependencies:
+      playwright: 1.60.0
+
   '@polka/url@1.0.0-next.29': {}
 
   '@poppinss/colors@4.1.6':
@@ -21315,6 +21382,9 @@ snapshots:
 
   fs.realpath@1.0.0: {}
 
+  fsevents@2.3.2:
+    optional: true
+
   fsevents@2.3.3:
     optional: true
 
@@ -23639,6 +23709,14 @@ snapshots:
       mlly: 1.8.0
       pathe: 2.0.3
 
+  playwright-core@1.60.0: {}
+
+  playwright@1.60.0:
+    dependencies:
+      playwright-core: 1.60.0
+    optionalDependencies:
+      fsevents: 2.3.2
+
   plist@3.1.0:
     dependencies:
       '@xmldom/xmldom': 0.8.11