reactjs - React renderToNodeStream 和 gzip/br/deflate

Question

使用 React/Express 开发 SSR 应用程序时，我试图总体上掌握 renderToNodeStream 和流。

我有一个大页面(400kb未压缩)并且使用renderToNodeStream给出了一个非常好的TTFB(第一个字节的时间)，我所错过的是一些压缩以使HTML响应更小发送回更小但我不能让它工作渲染到节点流。

我错过了什么吗？
是否可以流式传输新渲染的响应并压缩它们？

const stream = renderToNodeStream(<MyApp/>)

// this doesn't work
stream.pipe(zlib.createGzip())
stream._flush = zlib.Z_SYNC_FLUSH

stream.pipe(
 res,
 { end: "false" }
)

// stream.on("data", data => {
//   console.log(data)
// })
stream.on("end", () => {
  res.end(pageEnd())
})

Answer 1

如果您使用express和 compression中间件，你可能需要编写

res.setHeader('Content-Type', 'text/html');

在流式传输到客户端之前。

如compression middleware code所示，如果 Content-Type 不存在，中间件不会压缩内容。

最终的代码是:

res.setHeader('Content-Type', 'text/html');

const stream = renderToNodeStream(<MyApp/>)

stream.pipe(
 res,
 { end: "false" }
)

stream.on("end", () => {
  res.end(pageEnd())
})