[RFC] Render Modes: Server (SSR), Static, Client, Meta, Stream

Hello RW Community,

@danny has developed a GitHub issue regarding the development of Redwood Render Modes. We welcome all feedback and comments. A summary excerpt is below, more details are in the issue. Please - let us know what you think!

:wave: Hello Redwood community, this is your chance to shape one of the major features in upcoming versions of Redwood! Let’s see if we can build this feature together!

I. Summary

Introduce the concept of “render modes” - a prop in the Routes file to determine how a Route (i.e. page) will be rendered. Render modes change two things:

  1. Where the route is rendered - server or client
  2. How the route is rendered - as HTML-only, a hydrated JS page, a hydrated JS page with dynamic HTML <head> tags

Proposed render modes are:

  • static - render this page as pure HTML with no JS tags, on every request to the server
  • server - render this page on every request on the server. This is equivalent to SSR.
  • client - traditional JAM Stack rendering - i.e. return a blank page with JS tags, and let the client do the rendering [this is the only currently supported mode].
  • meta - only render up-to and including the MetaTags in a page component. This seems to be a common reason why users want SSR, to generate dynamic OpenGraph headers. “Partial SSR” like this keeps complexity low in your codebase, but still gives you the ability to generate dynamic <meta> tags for link previews on socials/slack/discord
  • Future: stream - this depends on React 18, and there’s a lot more to understand here before we make it official

The reason we offer render modes, is so that you can choose the level of complexity you want in your application. Everything in software is a tradeoff!

The more you render on the server, the higher the complexity is - you need to make sure your page (and all of its downstream components) can be rendered server-side correctly - just like prerendering.

Somewhat ironically too - although server-rendering can improve performance in most cases, as your app gets popular unless your infrastructure can keep up with the number of requests, it may actually degrade performance.

…

Again, check out the full post in our GitHub repo: [RFC]: Render Modes - your input needed!

2 Likes