Background
There was an experimental branch (react-performance) with changes claiming ~20% performance improvement for @fastify/react SSR. The branch was incomplete and stale, but the ideas are worth revisiting.
Optimization Ideas
1. Sparse serialization in toJSON()
Only include properties that have values, reducing payload size:
// Instead of always including all properties:
toJSON() {
return {
actionData: this.actionData,
state: this.state,
data: this.data,
// ...
}
}
// Only include properties with values:
toJSON() {
const json = {}
if (this.actionData) json.actionData = this.actionData
if (this.state) json.state = this.state
if (this.data) json.data = this.data
// ...
return json
}
2. Hook consolidation
Move preHandler logic into onRequest to reduce hook overhead - fewer async boundaries.
3. Use renderToString for non-streaming SSR
When streaming isn't needed, renderToString may be simpler and faster than renderToPipeableStream.
4. Use native PassThrough over Minipass
Remove the minipass dependency in favor of Node's native PassThrough stream.
Next Steps
Background
There was an experimental branch (
react-performance) with changes claiming ~20% performance improvement for@fastify/reactSSR. The branch was incomplete and stale, but the ideas are worth revisiting.Optimization Ideas
1. Sparse serialization in
toJSON()Only include properties that have values, reducing payload size:
2. Hook consolidation
Move
preHandlerlogic intoonRequestto reduce hook overhead - fewer async boundaries.3. Use
renderToStringfor non-streaming SSRWhen streaming isn't needed,
renderToStringmay be simpler and faster thanrenderToPipeableStream.4. Use native
PassThroughoverMinipassRemove the
minipassdependency in favor of Node's nativePassThroughstream.Next Steps