main
Branches
main (2.16.8)dev
Versions
2.16.81.19.3v0.21.0
React Router v7 has been released. View the docs
defer

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",  },  }  ); }; 
Docs and examples licensed under MIT