diff --git a/examples/app-dir-experiments/app/ssr/ApolloWrapper.tsx b/examples/app-dir-experiments/app/ssr/ApolloWrapper.tsx
index cb52c1f9..725586ef 100644
--- a/examples/app-dir-experiments/app/ssr/ApolloWrapper.tsx
+++ b/examples/app-dir-experiments/app/ssr/ApolloWrapper.tsx
@@ -1,14 +1,10 @@
 "use client";
 
-import {
-  ApolloClient,
-  ApolloLink,
-  HttpLink,
-  SuspenseCache,
-} from "@apollo/client";
+import { ApolloLink, HttpLink, SuspenseCache } from "@apollo/client";
 import {
   ApolloNextAppProvider,
   NextSSRInMemoryCache,
+  NextSSRApolloClient,
   SSRMultipartLink,
 } from "@apollo/experimental-nextjs-app-support/ssr";
 import { setVerbosity } from "ts-invariant";
@@ -21,7 +17,7 @@ function makeClient() {
     fetchOptions: { cache: "no-store" },
   });
 
-  return new ApolloClient({
+  return new NextSSRApolloClient({
     cache: new NextSSRInMemoryCache(),
     link:
       typeof window === "undefined"
diff --git a/examples/app-dir-experiments/package.json b/examples/app-dir-experiments/package.json
index af4cbbbf..d9777b84 100644
--- a/examples/app-dir-experiments/package.json
+++ b/examples/app-dir-experiments/package.json
@@ -10,7 +10,7 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@apollo/client": ">=3.8.0-beta.2",
+    "@apollo/client": ">=3.8.0-beta.4",
     "@apollo/experimental-nextjs-app-support": "workspace:^",
     "@apollo/server": "^4.6.0",
     "@as-integrations/next": "^1.3.0",
diff --git a/examples/hack-the-supergraph-ssr/app/ApolloWrapper.tsx b/examples/hack-the-supergraph-ssr/app/ApolloWrapper.tsx
index 19cbf80f..c914cb2e 100644
--- a/examples/hack-the-supergraph-ssr/app/ApolloWrapper.tsx
+++ b/examples/hack-the-supergraph-ssr/app/ApolloWrapper.tsx
@@ -1,15 +1,11 @@
 "use client";
 import React from "react";
-import {
-  ApolloClient,
-  ApolloLink,
-  HttpLink,
-  SuspenseCache,
-} from "@apollo/client";
+import { ApolloLink, HttpLink, SuspenseCache } from "@apollo/client";
 import clientCookies from "js-cookie";
 import {
   ApolloNextAppProvider,
   NextSSRInMemoryCache,
+  NextSSRApolloClient,
   SSRMultipartLink,
 } from "@apollo/experimental-nextjs-app-support/ssr";
 
@@ -75,7 +71,7 @@ export function ApolloWrapper({
           ])
         : ApolloLink.from([delayLink, httpLink]);
 
-    return new ApolloClient({
+    return new NextSSRApolloClient({
       cache: new NextSSRInMemoryCache(),
       link,
     });
diff --git a/examples/hack-the-supergraph-ssr/app/error.tsx b/examples/hack-the-supergraph-ssr/app/error.tsx
index 686d12fa..1b836d61 100644
--- a/examples/hack-the-supergraph-ssr/app/error.tsx
+++ b/examples/hack-the-supergraph-ssr/app/error.tsx
@@ -4,16 +4,14 @@ import React from "react";
 import { Box, Heading, Text, VStack } from "@chakra-ui/react";
 
 export const Error = ({
-  children,
-  code,
   error,
-}: React.PropsWithChildren<{
-  code?: string;
-  error: { toString(): string };
-}>) => (
+  reset,
+}: {
+  error: Error;
+  reset: () => void;
+}) => (
   <VStack spacing="12">
     <VStack textAlign="center">
-      <Heading size="4xl">{code ?? "Unknown Error"}</Heading>
       <Heading fontSize="3xl">Houston, something went wrong on our end</Heading>
       <Text>Please review the information below for more details.</Text>
     </VStack>
@@ -25,10 +23,9 @@ export const Error = ({
         borderRadius="8px"
         borderColor="brand.light"
       >
-        <Text color="brand.error">{error.toString()}</Text>
+        <Text color="brand.error">Error: {error.message}</Text>
       </Box>
     )}
-    {children}
   </VStack>
 );
 
diff --git a/examples/hack-the-supergraph-ssr/package.json b/examples/hack-the-supergraph-ssr/package.json
index 80227a09..0c9326bc 100644
--- a/examples/hack-the-supergraph-ssr/package.json
+++ b/examples/hack-the-supergraph-ssr/package.json
@@ -10,7 +10,7 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@apollo/client": ">=3.8.0-beta.2",
+    "@apollo/client": ">=3.8.0-beta.4",
     "@apollo/experimental-nextjs-app-support": "workspace:^",
     "@apollo/space-kit": "^9.11.0",
     "@chakra-ui/next-js": "^2.1.2",
diff --git a/examples/polls-demo/app/cc/apollo-wrapper.tsx b/examples/polls-demo/app/cc/apollo-wrapper.tsx
index ec3e398a..59fcb8c0 100644
--- a/examples/polls-demo/app/cc/apollo-wrapper.tsx
+++ b/examples/polls-demo/app/cc/apollo-wrapper.tsx
@@ -1,12 +1,8 @@
 "use client";
 
+import { ApolloLink, HttpLink, SuspenseCache } from "@apollo/client";
 import {
-  ApolloClient,
-  ApolloLink,
-  HttpLink,
-  SuspenseCache,
-} from "@apollo/client";
-import {
+  NextSSRApolloClient,
   ApolloNextAppProvider,
   NextSSRInMemoryCache,
   SSRMultipartLink,
@@ -25,7 +21,7 @@ function makeClient() {
     uri: "https://fragrant-shadow-9470.fly.dev/",
   });
 
-  return new ApolloClient({
+  return new NextSSRApolloClient({
     cache: new NextSSRInMemoryCache(),
     link:
       typeof window === "undefined"
diff --git a/examples/polls-demo/app/cc/error.tsx b/examples/polls-demo/app/cc/error.tsx
index ba4be923..775d0917 100644
--- a/examples/polls-demo/app/cc/error.tsx
+++ b/examples/polls-demo/app/cc/error.tsx
@@ -1,5 +1,11 @@
 "use client";
 
-export default function Error(error: { toString(): string }) {
-  return <p>Error: {error.toString()}</p>;
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error;
+  reset: () => void;
+}) {
+  return <p>Error: {error.message}</p>;
 }
diff --git a/examples/polls-demo/app/cc/loading.tsx b/examples/polls-demo/app/cc/loading.tsx
deleted file mode 100644
index 999450c4..00000000
--- a/examples/polls-demo/app/cc/loading.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { PollSkeleton } from "@/components/poll";
-
-export default function Loading() {
-  return <PollSkeleton />;
-}
diff --git a/examples/polls-demo/app/cc/page.tsx b/examples/polls-demo/app/cc/page.tsx
index b295992c..6da0b3e7 100644
--- a/examples/polls-demo/app/cc/page.tsx
+++ b/examples/polls-demo/app/cc/page.tsx
@@ -1,7 +1,7 @@
-import { Poll } from "./poll-cc";
+import { PollWrapper } from "./poll-cc";
 
 export const dynamic = "force-dynamic";
 
 export default async function Home() {
-  return <Poll />;
+  return <PollWrapper />;
 }
diff --git a/examples/polls-demo/app/cc/poll-cc.tsx b/examples/polls-demo/app/cc/poll-cc.tsx
index 7522b0c8..0d669475 100644
--- a/examples/polls-demo/app/cc/poll-cc.tsx
+++ b/examples/polls-demo/app/cc/poll-cc.tsx
@@ -1,7 +1,11 @@
 "use client";
-
-import { useSuspenseQuery } from "@apollo/experimental-nextjs-app-support/ssr";
+import { Suspense } from "react";
+import {
+  useReadQuery,
+  useBackgroundQuery,
+} from "@apollo/experimental-nextjs-app-support/ssr";
 import { useMutation } from "@apollo/client";
+import { QueryReference } from "@apollo/client/react/cache/QueryReference";
 import { Poll as PollInner } from "@/components/poll";
 
 import { useState, useCallback } from "react";
@@ -9,15 +13,24 @@ import { useState, useCallback } from "react";
 import {
   AnswerPollDocument,
   GetPollDocument,
+  GetPollQuery,
 } from "@/components/poll/documents.generated";
 
-export const Poll = () => {
-  const [showResults, setShowResults] = useState(false);
-
-  const { data } = useSuspenseQuery(GetPollDocument, {
+export const PollWrapper = () => {
+  const [queryRef] = useBackgroundQuery(GetPollDocument, {
     variables: { id: "1", delay: 0 },
   });
 
+  return (
+    <Suspense fallback={<>Loading...</>}>
+      <Poll queryRef={queryRef} />
+    </Suspense>
+  );
+};
+
+const Poll = ({ queryRef }: { queryRef: QueryReference<GetPollQuery> }) => {
+  const { data } = useReadQuery(queryRef);
+  const [showResults, setShowResults] = useState(false);
   const [mutate, { loading: mutationLoading }] =
     useMutation(AnswerPollDocument);
 
diff --git a/examples/polls-demo/package.json b/examples/polls-demo/package.json
index bdb8fe38..bef66cd3 100644
--- a/examples/polls-demo/package.json
+++ b/examples/polls-demo/package.json
@@ -12,7 +12,7 @@
     "codegen": "graphql-codegen --config codegen.ts"
   },
   "dependencies": {
-    "@apollo/client": ">=3.8.0-beta.2",
+    "@apollo/client": ">=3.8.0-beta.4",
     "@apollo/experimental-nextjs-app-support": "workspace:^",
     "@apollo/server": "^4.7.0",
     "@as-integrations/next": "^1.3.0",
diff --git a/package/.eslintrc.js b/package/.eslintrc.js
index 505b533b..a66876e0 100644
--- a/package/.eslintrc.js
+++ b/package/.eslintrc.js
@@ -20,5 +20,11 @@ module.exports = {
   rules: {
     "@typescript-eslint/no-explicit-any": "off",
     "react/prop-types": "off",
+    "@typescript-eslint/no-unused-vars": [
+      "warn",
+      {
+        varsIgnorePattern: "^_",
+      },
+    ],
   },
 };
diff --git a/package/README.md b/package/README.md
index 47f06456..15c39e76 100644
--- a/package/README.md
+++ b/package/README.md
@@ -82,7 +82,6 @@ First, create a new file `app/ApolloWrapper.js`:
 // ^ this file needs the "use client" pragma
 
 import {
-  ApolloClient,
   ApolloLink,
   HttpLink,
   SuspenseCache,
@@ -90,6 +89,7 @@ import {
 import {
   ApolloNextAppProvider,
   NextSSRInMemoryCache,
+  NextSSRApolloClient,
   SSRMultipartLink,
 } from "@apollo/experimental-nextjs-app-support/ssr";
 
@@ -103,7 +103,7 @@ function makeClient() {
     fetchOptions: { cache: "no-store" },
   });
 
-  return new ApolloClient({
+  return new NextSSRApolloClient({
     // use the `NextSSRInMemoryCache`, not the normal `InMemoryCache`
     cache: new NextSSRInMemoryCache(),
     link:
@@ -164,7 +164,12 @@ export default function RootLayout({
 > ☝️ This will work even if your layout is a React Server Component and will also allow the children of the layout to be React Server Components.  
 > It just makes sure that all Client Components will have access to the same Apollo Client instance, shared through the `ApolloNextAppProvider`.
 
-Now you can use the hooks `useQuery`, `useSuspenseQuery`, `useFragment`, and `useApolloClient` from `"@apollo/experimental-nextjs-app-support/ssr"` in your Client components like you are used to.
+You can import the following Apollo Client hooks from `"@apollo/experimental-nextjs-app-support/ssr"` in your client components (make sure you are not importing these hooks from `@apollo/client` as this package wraps and re-exports them to support streaming SSR):
+- `useQuery`
+- `useSuspenseQuery`
+- `useBackgroundQuery`
+- `useReadQuery`
+- `useFragment`
 
 If you want to make the most of the streaming SSR features offered by React & the Next.js App Router, consider using the [`useSuspenseQuery`](https://www.apollographql.com/docs/react/api/react/hooks-experimental/#using-usesuspensequery_experimental) and [`useFragment`](https://www.apollographql.com/docs/react/api/react/hooks-experimental/#using-usefragment_experimental) hooks.
 
diff --git a/package/package.json b/package/package.json
index 214cce12..afbbba18 100644
--- a/package/package.json
+++ b/package/package.json
@@ -44,7 +44,7 @@
   },
   "packageManager": "yarn@3.5.0",
   "devDependencies": {
-    "@apollo/client": ">=3.8.0-beta.2",
+    "@apollo/client": ">=3.8.0-beta.4",
     "@total-typescript/shoehorn": "^0.1.0",
     "@tsconfig/recommended": "^1.0.1",
     "@typescript-eslint/eslint-plugin": "latest",
@@ -59,7 +59,7 @@
     "vitest": "^0.30.1"
   },
   "peerDependencies": {
-    "@apollo/client": ">=3.8.0-beta.2",
+    "@apollo/client": ">=3.8.0-beta.4",
     "next": "^13.4.1",
     "react": "^18"
   },
diff --git a/package/src/ssr/ApolloRehydrateSymbols.tsx b/package/src/ssr/ApolloRehydrateSymbols.tsx
index 5a83c98e..fd91fe1c 100644
--- a/package/src/ssr/ApolloRehydrateSymbols.tsx
+++ b/package/src/ssr/ApolloRehydrateSymbols.tsx
@@ -1,5 +1,9 @@
 import { SuperJSONResult } from "superjson/dist/types";
-import { RehydrationCache, ResultsCache } from "./types";
+import {
+  RehydrationCache,
+  ResultsCache,
+  BackgroundQueriesCache,
+} from "./types";
 import type { DataTransport } from "./dataTransport";
 
 declare global {
@@ -7,8 +11,12 @@ declare global {
     [ApolloRehydrationCache]?: RehydrationCache;
     [ApolloResultCache]?: ResultsCache;
     [ApolloSSRDataTransport]?: DataTransport<SuperJSONResult>;
+    [ApolloBackgroundQueryTransport]?: BackgroundQueriesCache;
   }
 }
 export const ApolloRehydrationCache = Symbol.for("ApolloRehydrationCache");
 export const ApolloResultCache = Symbol.for("ApolloResultCache");
 export const ApolloSSRDataTransport = Symbol.for("ApolloSSRDataTransport");
+export const ApolloBackgroundQueryTransport = Symbol.for(
+  "ApolloBackgroundQueryTransport"
+);
diff --git a/package/src/ssr/NextSSRApolloClient.tsx b/package/src/ssr/NextSSRApolloClient.tsx
new file mode 100644
index 00000000..1158b2c3
--- /dev/null
+++ b/package/src/ssr/NextSSRApolloClient.tsx
@@ -0,0 +1,170 @@
+import {
+  ApolloClient,
+  ApolloClientOptions,
+  OperationVariables,
+  WatchQueryOptions,
+  Observable,
+  FetchResult,
+  DocumentNode,
+} from "@apollo/client";
+import type { QueryManager } from "@apollo/client/core/QueryManager";
+import { print } from "graphql";
+import { canonicalStringify } from "@apollo/client/cache";
+import { RehydrationContextValue } from "./types";
+import { registerLateInitializingQueue } from "./lateInitializingQueue";
+import {
+  ApolloBackgroundQueryTransport,
+  ApolloResultCache,
+} from "./ApolloRehydrateSymbols";
+
+function getQueryManager<TCacheShape>(
+  client: ApolloClient<unknown>
+): QueryManager<TCacheShape> {
+  return client["queryManager"];
+}
+
+export class NextSSRApolloClient<
+  TCacheShape
+> extends ApolloClient<TCacheShape> {
+  private rehydrationContext: Pick<
+    RehydrationContextValue,
+    "incomingBackgroundQueries"
+  > = {
+    incomingBackgroundQueries: [],
+  };
+
+  constructor(options: ApolloClientOptions<TCacheShape>) {
+    super(options);
+
+    this.registerWindowHook();
+  }
+
+  private resolveFakeQueries = new Map<
+    string,
+    [(result: FetchResult) => void, (reason: any) => void]
+  >();
+
+  private identifyUniqueQuery(options: {
+    query: DocumentNode;
+    variables?: unknown;
+  }) {
+    const transformedDocument = this.documentTransform.transformDocument(
+      options.query
+    );
+    const queryManager = getQueryManager<TCacheShape>(this);
+    // Calling `transformDocument` will add __typename but won't remove client
+    // directives, so we need to get the `serverQuery`.
+    const { serverQuery } = queryManager.getDocumentInfo(transformedDocument);
+
+    const canonicalVariables = canonicalStringify(options.variables);
+
+    const cacheKey = [serverQuery, canonicalVariables].toString();
+
+    return { query: serverQuery, cacheKey, varJson: canonicalVariables };
+  }
+
+  private registerWindowHook() {
+    if (typeof window !== "undefined") {
+      if (Array.isArray(window[ApolloBackgroundQueryTransport] || [])) {
+        registerLateInitializingQueue(
+          ApolloBackgroundQueryTransport,
+          (options) => {
+            const { query, varJson, cacheKey } =
+              this.identifyUniqueQuery(options);
+
+            if (!query) return;
+            const printedServerQuery = print(query);
+            const queryManager = getQueryManager<TCacheShape>(this);
+
+            const byVariables =
+              queryManager["inFlightLinkObservables"].get(printedServerQuery) ||
+              new Map();
+
+            queryManager["inFlightLinkObservables"].set(
+              printedServerQuery,
+              byVariables
+            );
+
+            if (!byVariables.has(varJson)) {
+              const promise = new Promise<FetchResult>((resolve, reject) => {
+                this.resolveFakeQueries.set(cacheKey, [resolve, reject]);
+              });
+              const cleanupCancelFn = () =>
+                queryManager["fetchCancelFns"].delete(cacheKey);
+
+              byVariables.set(
+                varJson,
+                new Observable<FetchResult>((observer) => {
+                  promise
+                    .then((result) => {
+                      observer.next(result);
+                      observer.complete();
+                    })
+                    .catch((err) => {
+                      observer.error(err);
+                    })
+                    .finally(() => {
+                      this.resolveFakeQueries.delete(cacheKey);
+                      cleanupCancelFn();
+                    });
+                })
+              );
+
+              queryManager["fetchCancelFns"].set(
+                cacheKey,
+                (reason: unknown) => {
+                  cleanupCancelFn();
+                  const [_, reject] =
+                    this.resolveFakeQueries.get(cacheKey) ?? [];
+                  if (reject) {
+                    reject(reason);
+                  }
+                }
+              );
+            }
+          }
+        );
+      }
+
+      if (Array.isArray(window[ApolloResultCache] || [])) {
+        registerLateInitializingQueue(ApolloResultCache, (data) => {
+          const { cacheKey } = this.identifyUniqueQuery(data);
+          const [resolve] = this.resolveFakeQueries.get(cacheKey) ?? [];
+
+          if (resolve) {
+            resolve({
+              data: data.result,
+            });
+            // In order to avoid a scenario where the promise resolves without
+            // a query subscribing to the promise, we immediately call
+            // `cache.write` here.
+            // For more information, see: https://github.com/apollographql/apollo-client-nextjs/pull/38/files/388813a16e2ac5c62408923a1face9ae9417d92a#r1229870523
+            this.cache.write(data);
+          }
+        });
+      }
+    }
+  }
+
+  watchQuery<
+    T = any,
+    TVariables extends OperationVariables = OperationVariables
+  >(options: WatchQueryOptions<TVariables, T>) {
+    if (typeof window == "undefined") {
+      this.rehydrationContext.incomingBackgroundQueries.push(options);
+    }
+    const result = super.watchQuery(options);
+    return result;
+  }
+
+  setRehydrationContext(rehydrationContext: RehydrationContextValue) {
+    if (
+      rehydrationContext.incomingBackgroundQueries !==
+      this.rehydrationContext.incomingBackgroundQueries
+    )
+      rehydrationContext.incomingBackgroundQueries.push(
+        ...this.rehydrationContext.incomingBackgroundQueries.splice(0)
+      );
+    this.rehydrationContext = rehydrationContext;
+  }
+}
diff --git a/package/src/ssr/NextSSRInMemoryCache.tsx b/package/src/ssr/NextSSRInMemoryCache.tsx
index ac4e2edd..9d505c77 100644
--- a/package/src/ssr/NextSSRInMemoryCache.tsx
+++ b/package/src/ssr/NextSSRInMemoryCache.tsx
@@ -4,9 +4,7 @@ import {
   Cache,
   Reference,
 } from "@apollo/client";
-import { ApolloResultCache } from "./ApolloRehydrateSymbols";
 import { RehydrationContextValue } from "./types";
-import { registerLateInitializingQueue } from "./lateInitializingQueue";
 
 export class NextSSRInMemoryCache extends InMemoryCache {
   private rehydrationContext: Pick<
@@ -18,21 +16,6 @@ export class NextSSRInMemoryCache extends InMemoryCache {
   };
   constructor(config?: InMemoryCacheConfig) {
     super(config);
-
-    this.registerWindowHook();
-  }
-  private registerWindowHook() {
-    if (typeof window !== "undefined") {
-      if (Array.isArray(window[ApolloResultCache] || [])) {
-        registerLateInitializingQueue(ApolloResultCache, (data) =>
-          this.write(data)
-        );
-      } else {
-        throw new Error(
-          "On the client side, only one instance of `NextSSRInMemoryCache` can be created!"
-        );
-      }
-    }
   }
 
   write(options: Cache.WriteOptions<any, any>): Reference | undefined {
diff --git a/package/src/ssr/RehydrationContext.tsx b/package/src/ssr/RehydrationContext.tsx
index a2f5d26f..0ad93f14 100644
--- a/package/src/ssr/RehydrationContext.tsx
+++ b/package/src/ssr/RehydrationContext.tsx
@@ -5,6 +5,7 @@ import { ServerInsertedHTMLContext } from "next/navigation";
 import { RehydrationContextValue } from "./types";
 import { registerDataTransport, transportDataToJS } from "./dataTransport";
 import invariant from "ts-invariant";
+import { NextSSRApolloClient } from "./NextSSRApolloClient";
 
 const ApolloRehydrationContext = React.createContext<
   RehydrationContextValue | undefined
@@ -13,15 +14,21 @@ const ApolloRehydrationContext = React.createContext<
 export const RehydrationContextProvider = ({
   children,
 }: React.PropsWithChildren) => {
-  const { cache } = useApolloClient();
+  const client = useApolloClient();
   const rehydrationContext = React.useRef<RehydrationContextValue>();
   if (typeof window == "undefined") {
     if (!rehydrationContext.current) {
       rehydrationContext.current = buildApolloRehydrationContext();
     }
-
-    if (cache instanceof NextSSRInMemoryCache) {
-      cache.setRehydrationContext(rehydrationContext.current);
+    if (client instanceof NextSSRApolloClient) {
+      client.setRehydrationContext(rehydrationContext.current);
+    } else {
+      throw new Error(
+        "When using Next SSR, you must use the `NextSSRApolloClient`"
+      );
+    }
+    if (client.cache instanceof NextSSRInMemoryCache) {
+      client.cache.setRehydrationContext(rehydrationContext.current);
     } else {
       throw new Error(
         "When using Next SSR, you must use the `NextSSRInMemoryCache`"
@@ -61,11 +68,13 @@ function buildApolloRehydrationContext(): RehydrationContextValue {
     transportValueData: {},
     transportedValues: {},
     incomingResults: [],
+    incomingBackgroundQueries: [],
     RehydrateOnClient() {
       rehydrationContext.currentlyInjected = false;
       if (
         !Object.keys(rehydrationContext.transportValueData).length &&
-        !Object.keys(rehydrationContext.incomingResults).length
+        !Object.keys(rehydrationContext.incomingResults).length &&
+        !Object.keys(rehydrationContext.incomingBackgroundQueries).length
       )
         return <></>;
       invariant.debug(
@@ -76,6 +85,10 @@ function buildApolloRehydrationContext(): RehydrationContextValue {
         "transporting results",
         rehydrationContext.incomingResults
       );
+      invariant.debug(
+        "transporting incomingBackgroundQueries",
+        rehydrationContext.incomingBackgroundQueries
+      );
 
       const __html = transportDataToJS({
         rehydrate: Object.fromEntries(
@@ -85,6 +98,7 @@ function buildApolloRehydrationContext(): RehydrationContextValue {
           )
         ),
         results: rehydrationContext.incomingResults,
+        backgroundQueries: rehydrationContext.incomingBackgroundQueries,
       });
       Object.assign(
         rehydrationContext.transportedValues,
@@ -92,6 +106,7 @@ function buildApolloRehydrationContext(): RehydrationContextValue {
       );
       rehydrationContext.transportValueData = {};
       rehydrationContext.incomingResults = [];
+      rehydrationContext.incomingBackgroundQueries = [];
       return (
         <script
           dangerouslySetInnerHTML={{
diff --git a/package/src/ssr/dataTransport.ts b/package/src/ssr/dataTransport.ts
index 323ec193..69c65e8d 100644
--- a/package/src/ssr/dataTransport.ts
+++ b/package/src/ssr/dataTransport.ts
@@ -3,10 +3,11 @@ import {
   ApolloSSRDataTransport,
   ApolloRehydrationCache,
   ApolloResultCache,
+  ApolloBackgroundQueryTransport,
 } from "./ApolloRehydrateSymbols";
 import { RehydrationCache } from "./types";
 import { registerLateInitializingQueue } from "./lateInitializingQueue";
-import { Cache } from "@apollo/client";
+import { Cache, WatchQueryOptions } from "@apollo/client";
 import invariant from "ts-invariant";
 
 export type DataTransport<T> = Array<T> | { push(...args: T[]): void };
@@ -14,6 +15,7 @@ export type DataTransport<T> = Array<T> | { push(...args: T[]): void };
 type DataToTransport = {
   rehydrate: RehydrationCache;
   results: Cache.WriteOptions[];
+  backgroundQueries: WatchQueryOptions[];
 };
 
 /**
@@ -35,6 +37,9 @@ export function registerDataTransport() {
     const parsed = SuperJSON.deserialize<DataToTransport>(data);
     invariant.debug(`received data from the server:`, parsed);
     Object.assign((window[ApolloRehydrationCache] ??= {}), parsed.rehydrate);
+    (window[ApolloBackgroundQueryTransport] ??= []).push(
+      ...parsed.backgroundQueries
+    );
     (window[ApolloResultCache] ??= []).push(...parsed.results);
   });
 }
diff --git a/package/src/ssr/hooks.ts b/package/src/ssr/hooks.ts
index d74e8fc9..1852becd 100644
--- a/package/src/ssr/hooks.ts
+++ b/package/src/ssr/hooks.ts
@@ -2,9 +2,12 @@
 import {
   useFragment as orig_useFragment,
   useSuspenseQuery as orig_useSuspenseQuery,
+  useReadQuery as orig_useReadQuery,
   useQuery as orig_useQuery,
+  useBackgroundQuery as orig_useBackgroundQuery,
 } from "@apollo/client";
 import { useTransportValue } from "./useTransportValue";
+import { useRehydrationContext } from "./RehydrationContext";
 
 export const useFragment = wrap(orig_useFragment, [
   "data",
@@ -21,6 +24,12 @@ export const useSuspenseQuery = wrap(orig_useSuspenseQuery, [
   "data",
   "networkStatus",
 ]);
+export const useReadQuery = wrap(orig_useReadQuery, ["data", "networkStatus"]);
+
+export const useBackgroundQuery: typeof orig_useBackgroundQuery = (...args: [any, any]) => {
+  useRehydrationContext();
+  return orig_useBackgroundQuery(...args);
+};
 
 function wrap<T extends (...args: any[]) => any>(
   useFn: T,
diff --git a/package/src/ssr/index.ts b/package/src/ssr/index.ts
index f95d40fd..d0890a6b 100644
--- a/package/src/ssr/index.ts
+++ b/package/src/ssr/index.ts
@@ -1,6 +1,13 @@
 export { ApolloNextAppProvider } from "./ApolloNextAppProvider";
 export { NextSSRInMemoryCache } from "./NextSSRInMemoryCache";
-export { useFragment, useQuery, useSuspenseQuery } from "./hooks";
+export { NextSSRApolloClient } from "./NextSSRApolloClient";
+export {
+  useFragment,
+  useQuery,
+  useSuspenseQuery,
+  useReadQuery,
+  useBackgroundQuery,
+} from "./hooks";
 export { SSRMultipartLink } from "./SSRMultipartLink";
 export { AccumulateMultipartResponsesLink as DebounceMultipartResponsesLink } from "./AccumulateMultipartResponsesLink";
 export { RemoveMultipartDirectivesLink } from "./RemoveMultipartDirectivesLink";
diff --git a/package/src/ssr/testHelpers.ts b/package/src/ssr/testHelpers.ts
index 787592e3..22434216 100644
--- a/package/src/ssr/testHelpers.ts
+++ b/package/src/ssr/testHelpers.ts
@@ -6,6 +6,7 @@ import {
   ApolloRehydrationCache,
   ApolloResultCache,
   ApolloSSRDataTransport,
+  ApolloBackgroundQueryTransport,
 } from "./ApolloRehydrateSymbols";
 
 /**
@@ -20,6 +21,7 @@ export function resetNextSSRApolloSingletons() {
   delete window[ApolloRehydrationCache];
   delete window[ApolloResultCache];
   delete window[ApolloSSRDataTransport];
+  delete window[ApolloBackgroundQueryTransport];
   delete window[ApolloClientSingleton];
   delete window[SuspenseCacheSingleton];
 }
diff --git a/package/src/ssr/types.tsx b/package/src/ssr/types.tsx
index 6d554151..4c3fd2dd 100644
--- a/package/src/ssr/types.tsx
+++ b/package/src/ssr/types.tsx
@@ -1,9 +1,10 @@
-import { Cache } from "@apollo/client";
+import { Cache, WatchQueryOptions } from "@apollo/client";
 import React from "react";
 import { DataTransport } from "./dataTransport";
 
 export type RehydrationCache = Record<string, unknown>;
 export type ResultsCache = DataTransport<Cache.WriteOptions>;
+export type BackgroundQueriesCache = DataTransport<WatchQueryOptions>;
 
 export interface RehydrationContextValue {
   /**
@@ -33,6 +34,11 @@ export interface RehydrationContextValue {
    * be replayed on the client.
    */
   incomingResults: Cache.WriteOptions[];
+  /**
+   * Background queries that are initialized on the server and can be safely
+   * ignored (i.e. not run a second time) on the client.
+   */
+  incomingBackgroundQueries: WatchQueryOptions<any, any>[];
   /**
    * Tracks if the `RehydrateOnClient` component is currently
    * injected into the `ServerInsertedHTMLHook`.
diff --git a/yarn.lock b/yarn.lock
index 12ba4542..d256403b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -31,9 +31,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@apollo/client@npm:>=3.8.0-beta.2":
-  version: 3.8.0-beta.2
-  resolution: "@apollo/client@npm:3.8.0-beta.2"
+"@apollo/client@npm:>=3.8.0-beta.4":
+  version: 3.8.0-beta.4
+  resolution: "@apollo/client@npm:3.8.0-beta.4"
   dependencies:
     "@graphql-typed-document-node/core": ^3.1.1
     "@wry/context": ^0.7.3
@@ -63,7 +63,7 @@ __metadata:
       optional: true
     subscriptions-transport-ws:
       optional: true
-  checksum: 2af797e1ac92ce5fcb09b8da4515fee3f4bbbbc3975475750a0de13841d27a02d60ff4e0be000bb955f15cf0ca116972f9c0f71696c6672c8b4b8b9f9a2446ed
+  checksum: 37f0cb2c195096221f979095c09bc3e60866ac2476cedfebeb856c908e603f9ba25c812ca4e5321d5f985ad48456c95d677ed94530aedaf8260546956dd86cec
   languageName: node
   linkType: hard
 
@@ -71,7 +71,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@apollo/experimental-nextjs-app-support@workspace:package"
   dependencies:
-    "@apollo/client": ">=3.8.0-beta.2"
+    "@apollo/client": ">=3.8.0-beta.4"
     "@total-typescript/shoehorn": ^0.1.0
     "@tsconfig/recommended": ^1.0.1
     "@typescript-eslint/eslint-plugin": latest
@@ -87,7 +87,7 @@ __metadata:
     typescript: ^5.0.2
     vitest: ^0.30.1
   peerDependencies:
-    "@apollo/client": ">=3.8.0-beta.2"
+    "@apollo/client": ">=3.8.0-beta.4"
     next: ^13.4.1
     react: ^18
   languageName: unknown
@@ -4753,7 +4753,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "apollo-next-13-demo@workspace:examples/polls-demo"
   dependencies:
-    "@apollo/client": ">=3.8.0-beta.2"
+    "@apollo/client": ">=3.8.0-beta.4"
     "@apollo/experimental-nextjs-app-support": "workspace:^"
     "@apollo/server": ^4.7.0
     "@as-integrations/next": ^1.3.0
@@ -4787,7 +4787,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "app-dir@workspace:examples/app-dir-experiments"
   dependencies:
-    "@apollo/client": ">=3.8.0-beta.2"
+    "@apollo/client": ">=3.8.0-beta.4"
     "@apollo/experimental-nextjs-app-support": "workspace:^"
     "@apollo/server": ^4.6.0
     "@as-integrations/next": ^1.3.0
@@ -7614,7 +7614,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "hack-the-supergraph-ssr@workspace:examples/hack-the-supergraph-ssr"
   dependencies:
-    "@apollo/client": ">=3.8.0-beta.2"
+    "@apollo/client": ">=3.8.0-beta.4"
     "@apollo/experimental-nextjs-app-support": "workspace:^"
     "@apollo/space-kit": ^9.11.0
     "@chakra-ui/next-js": ^2.1.2