• Create a middleware that gives you access to a TimingCollector instance, used to collect server timing metrics and report them in the response headers.

    The reported metrics will be available in the browser's developer tools.

    Returns unstable_createServerTimingMiddleware.ReturnType

    A tuple with the middleware function and a function to get the TimingCollector instance from the context.

    import { unstable_createServerTimingMiddleware } from "remix-utils/middleware/server-timing";

    const [serverTimingMiddleware, getTimingCollector] = unstable_createServerTimingMiddleware();

    export const unstable_middleware = [serverTimingMiddleware];

    export async function loader({ context }: Route.LoaderArgs) {
    let collector = getTimingCollector(context);
    return await collector.measure("name", "optional description", () => {
    return getData();
    });
    }