diff --git a/.changeset/stale-apples-reply.md b/.changeset/stale-apples-reply.md
new file mode 100644
index 00000000000..17bff0bcf6e
--- /dev/null
+++ b/.changeset/stale-apples-reply.md
@@ -0,0 +1,11 @@
+---
+"@remix-run/react": patch
+"@remix-run/server-runtime": patch
+---
+
+Emulate types for `JSON.parse(JSON.stringify(x))` in `SerializeFrom`
+
+Notably, type fields that are only assignable to `undefined` after serialization are now omitted since
+`JSON.stringify |> JSON.parse` will omit them. See test cases for examples.
+
+Also fixes type errors when upgrading to v2 from 1.19
diff --git a/packages/remix-react/__tests__/hook-types-test.tsx b/packages/remix-react/__tests__/hook-types-test.tsx
deleted file mode 100644
index 28ffd592f00..00000000000
--- a/packages/remix-react/__tests__/hook-types-test.tsx
+++ /dev/null
@@ -1,331 +0,0 @@
-import type {
-  TypedDeferredData,
-  TypedResponse,
-} from "@remix-run/server-runtime";
-
-import type { useLoaderData, useRouteLoaderData } from "../components";
-
-function isEqual<A, B>(
-  arg: A extends B ? (B extends A ? true : false) : false
-): void {}
-
-type LoaderData<T> = ReturnType<typeof useLoaderData<T>>;
-type RouteLoaderData<T> = ReturnType<typeof useRouteLoaderData<T>>;
-
-describe("useLoaderData", () => {
-  it("supports plain data type", () => {
-    type AppData = { hello: string };
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<response, { hello: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports plain Response", () => {
-    type Loader = (args: any) => Response;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, any>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("infers type regardless of redirect", () => {
-    type Loader = (
-      args: any
-    ) => TypedResponse<{ id: string }> | TypedResponse<never>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { id: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports Response-returning loader", () => {
-    type Loader = (args: any) => TypedResponse<{ hello: string }>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports async Response-returning loader", () => {
-    type Loader = (args: any) => Promise<TypedResponse<{ hello: string }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports data-returning loader", () => {
-    type Loader = (args: any) => { hello: string };
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports async data-returning loader", () => {
-    type Loader = (args: any) => Promise<{ hello: string }>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-});
-
-describe("type serializer", () => {
-  it("converts Date to string", () => {
-    type AppData = { hello: Date };
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<response, { hello: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports custom toJSON", () => {
-    type AppData = { toJSON(): { data: string[] } };
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<response, { data: string[] }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports recursion", () => {
-    type AppData = { dob: Date; parent: AppData };
-    type SerializedAppData = { dob: string; parent: SerializedAppData };
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<response, SerializedAppData>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports tuples and arrays", () => {
-    type AppData = { arr: Date[]; tuple: [string, number, Date]; empty: [] };
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<
-      response,
-      { arr: string[]; tuple: [string, number, string]; empty: [] }
-    >(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("transforms unserializables to null in arrays", () => {
-    type AppData = [Function, symbol, undefined];
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<response, [null, null, null]>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("transforms unserializables to never in objects", () => {
-    type AppData = { arg1: Function; arg2: symbol; arg3: undefined };
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<response, {}>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports class instances", () => {
-    class Test {
-      arg: string;
-      speak: () => string;
-    }
-    type Loader = (args: any) => TypedResponse<Test>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { arg: string }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("makes keys optional if the value is undefined", () => {
-    type AppData = {
-      arg1: string;
-      arg2: number | undefined;
-      arg3: undefined;
-    };
-    type response = LoaderData<AppData>;
-    type routeResponse = RouteLoaderData<AppData>;
-    isEqual<response, { arg1: string; arg2?: number }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("allows data key in value", () => {
-    type AppData = { data: { hello: string } };
-    type response = LoaderData<AppData>;
-    isEqual<response, { data: { hello: string } }>(true);
-  });
-});
-
-describe("deferred type serializer", () => {
-  it("supports synchronous loader", () => {
-    type Loader = (
-      args: any
-    ) => TypedDeferredData<{ hello: string; lazy: Promise<string> }>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string; lazy: Promise<string> }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports asynchronous loader", () => {
-    type Loader = (
-      args: any
-    ) => Promise<TypedDeferredData<{ hello: string; lazy: Promise<string> }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string; lazy: Promise<string> }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports synchronous loader with deferred object result", () => {
-    type Loader = (
-      args: any
-    ) => TypedDeferredData<{ hello: string; lazy: Promise<{ a: number }> }>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string; lazy: Promise<{ a: number }> }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports asynchronous loader with deferred object result", () => {
-    type Loader = (
-      args: any
-    ) => Promise<
-      TypedDeferredData<{ hello: string; lazy: Promise<{ a: number }> }>
-    >;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string; lazy: Promise<{ a: number }> }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("converts Date to string", () => {
-    type Loader = (
-      args: any
-    ) => Promise<
-      TypedDeferredData<{ hello: Date; lazy: Promise<{ a: Date }> }>
-    >;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: string; lazy: Promise<{ a: string }> }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports custom toJSON", () => {
-    type AppData = { toJSON(): { data: string[] } };
-    type Loader = (
-      args: any
-    ) => Promise<
-      TypedDeferredData<{ hello: AppData; lazy: Promise<{ a: AppData }> }>
-    >;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<
-      response,
-      { hello: { data: string[] }; lazy: Promise<{ a: { data: string[] } }> }
-    >(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports recursion", () => {
-    type AppData = { dob: Date; parent: AppData };
-    type SerializedAppData = { dob: string; parent: SerializedAppData };
-    type Loader = (
-      args: any
-    ) => Promise<TypedDeferredData<{ hello: AppData; lazy: Promise<AppData> }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<
-      response,
-      { hello: SerializedAppData; lazy: Promise<SerializedAppData> }
-    >(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports tuples and arrays", () => {
-    type AppData = { arr: Date[]; tuple: [string, number, Date]; empty: [] };
-    type SerializedAppData = {
-      arr: string[];
-      tuple: [string, number, string];
-      empty: [];
-    };
-    type Loader = (
-      args: any
-    ) => Promise<TypedDeferredData<{ hello: AppData; lazy: Promise<AppData> }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<
-      response,
-      { hello: SerializedAppData; lazy: Promise<SerializedAppData> }
-    >(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("transforms unserializables to null in arrays", () => {
-    type AppData = [Function, symbol, undefined];
-    type SerializedAppData = [null, null, null];
-    type Loader = (
-      args: any
-    ) => Promise<TypedDeferredData<{ hello: AppData; lazy: Promise<AppData> }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<
-      response,
-      { hello: SerializedAppData; lazy: Promise<SerializedAppData> }
-    >(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("transforms unserializables to never in objects", () => {
-    type AppData = { arg1: Function; arg2: symbol; arg3: undefined };
-    type Loader = (
-      args: any
-    ) => Promise<TypedDeferredData<{ hello: AppData; lazy: Promise<AppData> }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<response, { hello: {}; lazy: Promise<{}> }>(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("supports class instances", () => {
-    class Test {
-      arg: string;
-      speak: () => string;
-    }
-    type Loader = (
-      args: any
-    ) => Promise<TypedDeferredData<{ hello: Test; lazy: Promise<Test> }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<
-      response,
-      { hello: { arg: string }; lazy: Promise<{ arg: string }> }
-    >(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("makes keys optional if the value is undefined", () => {
-    type AppData = {
-      arg1: string;
-      arg2: number | undefined;
-      arg3: undefined;
-    };
-    type SerializedAppData = { arg1: string; arg2?: number };
-    type Loader = (
-      args: any
-    ) => Promise<TypedDeferredData<{ hello: AppData; lazy: Promise<AppData> }>>;
-    type response = LoaderData<Loader>;
-    type routeResponse = RouteLoaderData<Loader>;
-    isEqual<
-      response,
-      { hello: SerializedAppData; lazy: Promise<SerializedAppData> }
-    >(true);
-    isEqual<response, routeResponse>(true);
-  });
-
-  it("allows data key in value", () => {
-    type AppData = { data: Promise<{ hello: string }> };
-    type response = LoaderData<AppData>;
-    isEqual<response, { data: Promise<{ hello: string }> }>(true);
-  });
-});
diff --git a/packages/remix-server-runtime/jsonify.ts b/packages/remix-server-runtime/jsonify.ts
new file mode 100644
index 00000000000..80a6c2b5afd
--- /dev/null
+++ b/packages/remix-server-runtime/jsonify.ts
@@ -0,0 +1,257 @@
+import {
+  expectType,
+  type Equal,
+  type Expect,
+  type MutualExtends,
+} from "./typecheck";
+
+// prettier-ignore
+// `Jsonify` emulates `let y = JSON.parse(JSON.stringify(x))`, but for types
+// so that we can infer the shape of the data sent over the network.
+export type Jsonify<T> =
+  // any
+  IsAny<T> extends true ? any :
+
+  // toJSON
+  T extends { toJSON(): infer U } ? (U extends JsonValue ? U : unknown) :
+
+  // primitives
+  T extends JsonPrimitive ? T :
+  T extends String ? string :
+  T extends Number ? number :
+  T extends Boolean ? boolean :
+
+  // Map & Set
+  T extends Map<unknown, unknown> ? EmptyObject :
+  T extends Set<unknown> ? EmptyObject :
+
+  // TypedArray
+  T extends TypedArray ? Record<string, number> :
+
+  // Not JSON serializable
+  T extends NotJson ? never :
+
+  // tuple & array
+  T extends [] ? [] :
+  T extends readonly [infer F, ...infer R] ? [NeverToNull<Jsonify<F>>, ...Jsonify<R>] :
+  T extends readonly unknown[] ? Array<NeverToNull<Jsonify<T[number]>>>:
+
+  // object
+  T extends Record<keyof unknown, unknown> ? JsonifyObject<T> :
+
+  // unknown
+  unknown extends T ? unknown :
+
+  never
+
+// value is always not JSON => true
+// value is always JSON => false
+// value is somtimes JSON, sometimes not JSON => boolean
+// note: cannot be inlined as logic requires union distribution
+type ValueIsNotJson<T> = T extends NotJson ? true : false;
+
+// note: remove optionality so that produced values are never `undefined`,
+// only `true`, `false`, or `boolean`
+type IsNotJson<T> = { [K in keyof T]-?: ValueIsNotJson<T[K]> };
+
+type JsonifyValues<T> = { [K in keyof T]: Jsonify<T[K]> };
+
+// prettier-ignore
+type JsonifyObject<T extends Record<keyof unknown, unknown>> =
+  // required
+  { [K in keyof T as
+    unknown extends T[K] ? never :
+    IsNotJson<T>[K] extends false ? K :
+    never
+  ]: JsonifyValues<T>[K] } &
+  // optional
+  { [K in keyof T as
+    unknown extends T[K] ? K :
+    // if the value is always JSON, then it's not optional
+    IsNotJson<T>[K] extends false ? never :
+    // if the value is always not JSON, omit it entirely
+    IsNotJson<T>[K] extends true ? never :
+    // if the value is mixed, then it's optional
+    K
+  ]? : JsonifyValues<T>[K]}
+
+// types ------------------------------------------------------------
+
+type JsonPrimitive = string | number | boolean | null;
+
+type JsonArray = JsonValue[] | readonly JsonValue[];
+
+// prettier-ignore
+type JsonObject =
+  { [K in string]: JsonValue } &
+  { [K in string]?: JsonValue }
+
+type JsonValue = JsonPrimitive | JsonObject | JsonArray;
+
+type NotJson = undefined | symbol | AnyFunction;
+
+type TypedArray =
+  | Int8Array
+  | Uint8Array
+  | Uint8ClampedArray
+  | Int16Array
+  | Uint16Array
+  | Int32Array
+  | Uint32Array
+  | Float32Array
+  | Float64Array
+  | BigInt64Array
+  | BigUint64Array;
+
+// tests ------------------------------------------------------------
+
+// prettier-ignore
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+type _tests = [
+  // any
+  Expect<Equal<Jsonify<any>, any>>,
+
+  // primitives
+  Expect<Equal<Jsonify<string>, string>>,
+  Expect<Equal<Jsonify<number>, number>>,
+  Expect<Equal<Jsonify<boolean>, boolean>>,
+  Expect<Equal<Jsonify<null>, null>>,
+  Expect<Equal<Jsonify<String>, string>>,
+  Expect<Equal<Jsonify<Number>, number>>,
+  Expect<Equal<Jsonify<Boolean>, boolean>>,
+
+  // Map & Set
+  Expect<Equal<Jsonify<Map<unknown, unknown>>, EmptyObject>>,
+  Expect<Equal<Jsonify<Set<unknown>>, EmptyObject>>,
+
+  // TypedArray
+  Expect<Equal<Jsonify<Int8Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Uint8Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Uint8ClampedArray>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Int16Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Uint16Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Int32Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Uint32Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Float32Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<Float64Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<BigInt64Array>, Record<string, number>>>,
+  Expect<Equal<Jsonify<BigUint64Array>, Record<string, number>>>,
+
+  // Not Json
+  Expect<Equal<Jsonify<undefined>, never>>,
+  Expect<Equal<Jsonify<AnyFunction>, never>>,
+  Expect<Equal<Jsonify<() => void>, never>>,
+  Expect<Equal<Jsonify<symbol>, never>>,
+
+  // toJson
+  Expect<Equal<Jsonify<{ toJSON(): "stuff" }>, "stuff">>,
+  Expect<Equal<Jsonify<Date>, string>>,
+  Expect<Equal<Jsonify<{ toJSON(): undefined }>, unknown>>,
+  Expect<Equal<Jsonify<{ toJSON(): Date }>, unknown>>,
+  Expect<Equal<Jsonify<BooleanWithToJson>, string>>,
+
+
+  // tuple & array
+  Expect<Equal<Jsonify<[]>, []>>,
+  Expect<Equal<Jsonify<[1, 'two', Date, undefined, false]>, [1, 'two', string, null, false]>>,
+  Expect<Equal<Jsonify<(string | number | undefined)[]>, (string | number)[]>>,
+  Expect<Equal<Jsonify<undefined[]>, null[]>>,
+  Expect<Equal<Jsonify<readonly [1,2,3]>, [1,2,3]>>,
+
+  // object
+  Expect<Equal<Pretty<Jsonify<{}>>, {}>>,
+  Expect<Equal<Pretty<Jsonify<{a: string}>>, {a: string}>>,
+  Expect<Equal<Pretty<Jsonify<{a: string | undefined}>>, {a?: string}>>,
+  Expect<Equal<Pretty<Jsonify<{a?: string | undefined}>>, {a?: string}>>,
+  Expect<Equal<Pretty<Jsonify<{a: string, b: string | undefined, c: undefined}>>, {a: string, b?: string}>>,
+  Expect<Equal<Pretty<Jsonify<{a: undefined}>>, {}>>,
+  Expect<Equal<Pretty<Jsonify<Record<string, any>>>, Record<string, any>>>,
+  Expect<Equal<Pretty<Jsonify<Record<string, number>>>, Record<string, number>>>,
+  Expect<MutualExtends<Jsonify<{payload: Record<string, any>}>, { payload: Record<string, any>}>>,
+  Expect<Equal<Pretty<Jsonify<{
+    // Should be kept
+    requiredString: string;
+    requiredUnion: number | boolean;
+
+    // Should be kept and set to optional
+    optionalString?: string;
+    optionalUnion?: number | string;
+    optionalStringUndefined: string | undefined;
+    optionalUnionUndefined: number | string | undefined;
+    requiredFunctionUnion: string | (() => any);
+    optionalFunctionUnion?: string | (() => any);
+    optionalFunctionUnionUndefined: string | (() => any) | undefined;
+
+    // Should be omitted
+    requiredFunction: () => any;
+    optionalFunction?: () => any;
+    optionalFunctionUndefined: (() => any) | undefined;
+  }>>, {
+    requiredString: string
+    requiredUnion: number | boolean
+
+    optionalString?: string;
+    optionalUnion?: number | string;
+    optionalStringUndefined?: string | undefined;
+    optionalUnionUndefined?: number | string | undefined;
+    requiredFunctionUnion?: string
+    optionalFunctionUnion?: string;
+    optionalFunctionUnionUndefined?: string
+  }>>,
+
+  // unknown
+  Expect<Equal<Jsonify<unknown>, unknown>>,
+  Expect<Equal<Jsonify<unknown[]>, unknown[]>>,
+  Expect<Equal<Jsonify<[unknown, 1]>, [unknown, 1]>>,
+  Expect<Equal<Pretty<Jsonify<{a: unknown}>>, {a?: unknown}>>,
+  Expect<Equal<Pretty<Jsonify<{a: unknown, b: 'hello'}>>, {a?: unknown, b: 'hello'}>>,
+
+  // never
+  Expect<Equal<Jsonify<never>, never>>,
+  Expect<Equal<Pretty<Jsonify<{a: never}>>, {a: never}>>,
+  Expect<Equal<Pretty<Jsonify<{a: never, b: string}>>, {a: never, b:string}>>,
+  Expect<Equal<Pretty<Jsonify<{a: never, b: string} | {a: string, b: never}>>, {a: never, b: string} | {a: string, b: never}>>,
+
+  // class
+  Expect<Equal<Pretty<Jsonify<MyClass>>, {a: string}>>,
+];
+
+class MyClass {
+  a: string;
+  b: () => string;
+
+  constructor() {
+    this.a = "hello";
+    this.b = () => "world";
+  }
+}
+
+// real-world example: `InvoiceLineItem` from `stripe`
+type Recursive = {
+  a: Date;
+  recur?: Recursive;
+};
+declare const recursive: Jsonify<Recursive>;
+expectType<{ a: string; recur?: Jsonify<Recursive> }>(
+  recursive.recur!.recur!.recur!
+);
+
+// real-world example: `Temporal` from `@js-temporal/polyfill`
+interface BooleanWithToJson extends Boolean {
+  toJSON(): string;
+}
+
+// utils ------------------------------------------------------------
+
+type Pretty<T> = { [K in keyof T]: T[K] };
+
+type AnyFunction = (...args: any[]) => unknown;
+
+type NeverToNull<T> = [T] extends [never] ? null : T;
+
+// adapted from https://github.com/sindresorhus/type-fest/blob/main/source/empty-object.d.ts
+declare const emptyObjectSymbol: unique symbol;
+type EmptyObject = { [emptyObjectSymbol]?: never };
+
+// adapted from https://github.com/type-challenges/type-challenges/blob/main/utils/index.d.ts
+type IsAny<T> = 0 extends 1 & T ? true : false;
diff --git a/packages/remix-server-runtime/package.json b/packages/remix-server-runtime/package.json
index 9dff84ea853..62819f396d7 100644
--- a/packages/remix-server-runtime/package.json
+++ b/packages/remix-server-runtime/package.json
@@ -21,8 +21,7 @@
     "@web3-storage/multipart-parser": "^1.0.0",
     "cookie": "^0.4.1",
     "set-cookie-parser": "^2.4.8",
-    "source-map": "^0.7.3",
-    "type-fest": "^4.0.0"
+    "source-map": "^0.7.3"
   },
   "devDependencies": {
     "@types/set-cookie-parser": "^2.4.1",
diff --git a/packages/remix-server-runtime/serialize.ts b/packages/remix-server-runtime/serialize.ts
index fb35d54cace..4a2a8a3a79c 100644
--- a/packages/remix-server-runtime/serialize.ts
+++ b/packages/remix-server-runtime/serialize.ts
@@ -1,10 +1,7 @@
-import type { Jsonify } from "type-fest";
-
-import type { AppData } from "./data";
+import type { Jsonify } from "./jsonify";
 import type { TypedDeferredData, TypedResponse } from "./responses";
-
-// Note: The return value has to be `any` and not `unknown` so it can match `void`.
-type Fn = (...args: any[]) => any;
+import { expectType } from "./typecheck";
+import { type Expect, type Equal } from "./typecheck";
 
 // prettier-ignore
 /**
@@ -13,29 +10,80 @@ type Fn = (...args: any[]) => any;
  * For example:
  * `type LoaderData = SerializeFrom<typeof loader>`
  */
-export type SerializeFrom<T extends AppData | Fn> =
-  T extends (...args: any[]) => infer Output ?
-    Awaited<Output> extends TypedResponse<infer U> ? Jsonify<U> :
-    Awaited<Output> extends TypedDeferredData<infer U> ?
-      // top-level promises
-      & {
-        [K in keyof U as
-          K extends symbol ? never :
-          Promise<any> extends U[K] ? K :
-          never
-        ]:
-        // use generic to distribute over union
-        DeferValue<U[K]>
-      }
-      // non-promises
-      & Jsonify<{ [K in keyof U as Promise<any> extends U[K] ? never : K]: U[K] }>
-      :
-    Jsonify<Awaited<Output>> :
+export type SerializeFrom<T> =
+  T extends (...args: any[]) => infer Output ? Serialize<Awaited<Output>> :
+  // Back compat: manually defined data type, not inferred from loader nor action
   Jsonify<Awaited<T>>
 ;
 
+// note: cannot be inlined as logic requires union distribution
+// prettier-ignore
+type Serialize<Output> =
+  Output extends TypedDeferredData<infer U> ?
+    // top-level promises
+    & {
+      [K in keyof U as
+        K extends symbol ? never :
+        Promise<any> extends U[K] ? K :
+        never
+      ]: DeferValue<U[K]>; // use generic to distribute over union
+    }
+    // non-promises
+    & Jsonify<{
+      [K in keyof U as
+        Promise<any> extends U[K] ? never :
+        K
+      ]: U[K];
+    }>
+  :
+  Output extends TypedResponse<infer U> ? Jsonify<U> :
+  Jsonify<Output>;
+
 // prettier-ignore
 type DeferValue<T> =
   T extends undefined ? undefined :
   T extends Promise<unknown> ? Promise<Jsonify<Awaited<T>>> :
   Jsonify<T>;
+
+// tests ------------------------------------------------------------
+
+type Pretty<T> = { [K in keyof T]: T[K] };
+
+type Loader<T> = () => Promise<
+  | TypedResponse<T> // returned responses
+  | TypedResponse<never> // thrown responses
+>;
+
+type LoaderDefer<T extends Record<keyof unknown, unknown>> = () => Promise<
+  | TypedDeferredData<T> // returned responses
+  | TypedResponse<never> // thrown responses
+>;
+
+// prettier-ignore
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+type _tests = [
+  // back compat: plain object
+  Expect<Equal<Pretty<SerializeFrom<{a: string}>>, {a: string}>>,
+
+  // only thrown responses (e.g. redirects)
+  Expect<Equal<SerializeFrom<Loader<never>>, never>>,
+
+  // basic loader data
+  Expect<Equal<Pretty<SerializeFrom<Loader<{a: string}>>>, {a: string}>>,
+
+  // infer data type from `toJSON`
+  Expect<Equal<Pretty<SerializeFrom<Loader<{a: Date}>>>, {a: string}>>,
+
+  // regression test for specific field names
+  Expect<Equal<Pretty<SerializeFrom<Loader<{a: string, name: number, data: boolean}>>>, {a: string, name: number, data: boolean}>>,
+
+  // defer top-level promises
+  Expect<SerializeFrom<LoaderDefer<{ a: string; lazy: Promise<{ b: number }>}>> extends {a: string, lazy: Promise<{ b: number }>} ? true : false>
+];
+
+// recursive
+type Recursive = { a: string; recur?: Recursive };
+declare const recursive: SerializeFrom<Loader<Recursive>>;
+expectType<{ a: string; recur?: Jsonify<Recursive> }>(
+  recursive.recur!.recur!.recur!
+);
diff --git a/packages/remix-server-runtime/typecheck.ts b/packages/remix-server-runtime/typecheck.ts
new file mode 100644
index 00000000000..7f6ffeab236
--- /dev/null
+++ b/packages/remix-server-runtime/typecheck.ts
@@ -0,0 +1,15 @@
+// typecheck that expression is assignable to type
+export function expectType<T>(_expression: T) {}
+
+// prettier-ignore
+// adapted from https://github.com/type-challenges/type-challenges/blob/main/utils/index.d.ts
+export type Equal<X, Y> =
+  (<T>() => T extends X ? 1 : 2) extends
+  (<T>() => T extends Y ? 1 : 2) ? true : false
+
+// adapted from https://github.com/type-challenges/type-challenges/blob/main/utils/index.d.ts
+export type Expect<T extends true> = T;
+
+// looser, lazy equality check for recursive types
+// prettier-ignore
+export type MutualExtends<A, B> = [A] extends [B] ? [B] extends [A] ? true : false : false