[FEATURE] SSR Support

[RedbackThomson]

Requirements

The existing OpenFeature React SDK relies solely on the @openfeature/web-sdk package, intended to run client side (in the browser). When attempting to use the React SDK inside a NextJS application with SSR enabled, NextJS fails to render the page on the server and in the best case causes the page to stutter as it hydrates but in the worst case causes the application to fail to render at all.

Today, in order to support SSR, our code needs to conditionally disable the use of the React SDK hooks (and the Web client) and replace them with the same call to the NodeJS SDK when it detects the code is executing within an SSR context (by checking window === undefined).

Ideally the React SDK would have an option to natively support SSR in which it would:

• Detect that it was running within an SSR context
• Switch to a @openfeature/server-sdk client
• Automatically bootstrap the web client provider with the resolved flags, for instant hydration

[beeme1mr]

Hey @RedbackThomson, thanks for kicking off this conversation. As I mentioned on Slack, I've run into similar challenges in the ToggleShop. I'd love to find a way to support SSR and possibly SSG seamlessly.

Do you think we should create a dedicated SDK for NextJS that adds Next-specific features? It would be nice to avoid supporting another SDK, but that may not be feasible.

@toddbaert @lukas-reining, do either of you have an opinion on this?

[beeme1mr]

Here's some additional resources that may be useful while researching this topic:

• https://blog.devcycle.com/feature-flagging-with-next-js-lessons-learned-from-developing-devcycles-sdk/
• https://blog.devcycle.com/devcycles-new-next-js-sdk-elevating-feature-flagging-in-next-js-apps/