`defer`

To get started with streaming data, check out the Streaming Guide.

This is a shortcut for creating a streaming/deferred response. It assumes you are using utf-8 encoding. From a developer perspective it behaves just like json(), but with the ability to transport promises to your UI components.

import { defer } from "@remix-run/node"; // or cloudflare/deno

export const loader = async () => {
  const aStillRunningPromise = loadSlowDataAsync();

  // So you can write this without awaiting the promise:
  return defer({
    critical: "data",
    slowPromise: aStillRunningPromise,
  });
};

You can also pass a status code and headers:

export const loader = async () => {
  const aStillRunningPromise = loadSlowDataAsync();

  return defer(
    {
      critical: "data",
      slowPromise: aStillRunningPromise,
    },
    {
      status: 418,
      headers: {
        "Cache-Control": "no-store",
      },
    }
  );
};