module() — react Function Reference

Architecture documentation for the module() function in render.js from the react codebase.

Function javascript BabelCompiler Entrypoint calls 1

Entity Profile

BabelCompiler→ Entrypoint→ module() — react Function Reference

Dependency Diagram

graph TD
  0aaed44d_e070_e526_ab5c_17110743fdc1["module()"]
  0107ee96_891d_0242_d19d_5ee01a72a676["render.js"]
  0aaed44d_e070_e526_ab5c_17110743fdc1 -->|defined in| 0107ee96_891d_0242_d19d_5ee01a72a676
  9e60fed0_4941_099c_2951_ba6e5ccf15a7["createServerData()"]
  0aaed44d_e070_e526_ab5c_17110743fdc1 -->|calls| 9e60fed0_4941_099c_2951_ba6e5ccf15a7
  style 0aaed44d_e070_e526_ab5c_17110743fdc1 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

fixtures/ssr2/server/render.js lines 22–70

module.exports = function render(url, res) {
  const data = createServerData();
  // This is how you would wire it up previously:
  //
  // res.send(
  //   '<!DOCTYPE html>' +
  //   renderToString(
  //     <DataProvider data={data}>
  //       <App assets={assets} />
  //     </DataProvider>,
  //   )
  // );

  // The new wiring is a bit more involved.
  res.socket.on('error', error => {
    console.error('Fatal', error);
  });
  let didError = false;
  const {pipe, abort} = renderToPipeableStream(
    <DataProvider data={data}>
      <App assets={assets} />
    </DataProvider>,
    {
      bootstrapScripts: [assets['main.js']],
      onAllReady() {
        // Full completion.
        // You can use this for SSG or crawlers.
      },
      onShellReady() {
        // If something errored before we started streaming, we set the error code appropriately.
        res.statusCode = didError ? 500 : 200;
        res.setHeader('Content-type', 'text/html');
        pipe(res);
      },
      onShellError(x) {
        // Something errored before we could complete the shell so we emit an alternative shell.
        res.statusCode = 500;
        res.send('<!doctype><p>Error</p>');
      },
      onError(x) {
        didError = true;
        console.error(x);
      },
    }
  );
  // Abandon and switch to client rendering if enough time passes.
  // Try lowering this to see the client recover.
  setTimeout(abort, ABORT_DELAY);
};