Allow defining codecs for Start server functions

[DASPRiD]

At the moment, server functions suffer the same problem as loaders in Remix and Next.js: Input and output must be JSON-serializable.

While you can manually do the encoding on each side (before calling the server function and before returning something from the server function), and do the decoding within the server function and on the client after calling it, this is anything but ideal.

I'd suggest to allow configuring codecs, both for the input as well as the output. A codec should have a form like this:

type Codec<I, O> = {
    // Encodes a value into primitives which can be serialized
    encode: (value: I) => O;
    // Takes serialized values and turns them back into something usable
    decode: (value: O) => I;
}

By using a type like this, it would allow using e.g. Zod (>=4.1.0) codecs for this: https://zod.dev/codecs

Beside being more ergonomic, this would also allow for optimizations; e.g. on server side calls the de- and encoding can be completely skipped, while it would only be used for hydration and client side calls.

Usage could look something like this:

import { createServerFn } from '@tanstack/react-start'
import { z } from 'zod'

const inputCodec = z.object({
  name: z.string(),
});

const isoDatetimeToDate = z.codec(z.iso.datetime(), z.date(), {
  decode: (isoString) => new Date(isoString),
  encode: (date) => date.toISOString(),
});

export const getData = createServerFn()
  .inputCodec(inputCodec)
  .outputCodec(outputCodec)
  .handler(async (input) => {
    const name = input.name;
    return new Date();
  })

Another advantage of this is that the input codec not only takes care of encoding on the client side, but also decode and validates on the input side. So this would eliminate the need for a separate validator. Additionally the output codec would ensure that the user returns the correct type from handler (enforced by TypeScript).

[schiller-manuel]

soon!