Community package for ssr with React 18

I have tried to add community package for ssr to meteor 2.15 and React 18 but it could not work. Please if there is a better way to do it please will like to have a tutoria link. @storyteller @copleykj @jkuester. Please anyone with idea help.

I’m afraid that there won’t be anything new for the Meteor 2.x and React 18 series. @copleykj is probable the best person around for this.

That said, Meteor 3 and React 19 offer some interesting possibilities that should make it easier.

1 Like

@simonwebs are you using redux or styled components in your project?

I think I will release a new version of this project for Meteor 2 with React 18 support. This will be a major change though. If I’m going to do it I might as well do it right. This will likely mean removing extraneous support for redux and styled components, and updating to React Router 6 with data routers to enable things like simple scroll restoration.

3 Likes

Please I dont use that I depents on tailwindcss and may be styled sometimes

I have a working version of communitypackages:react-router-ssr with React 18, and React Router 6 using the browser data router. These changes are in the devel branch of the package’s githup repo currently. One minor issue is that the data router requires a fully qualified url to work correctly and that’s currently not available on the sink object that the server-render package provides. I’ve worked around this for now, but I want to make sure that there isn’t a better way, and that the work around will be reliable.

1 Like

We were unsuccessful in moving to React 18 with SSR for Meteor 2.x. We guess that React 18’s concurrent mode is incompatible with Fibers, causing the React context to leak information to other routines.

This was not apparent during development when a single connection created only a single SSR page. The issues happened in production once multiple concurrent connections created different SSR pages. One SSR page was loading different data coming from a different page.

This issue should be solved by the removal of Fibers in Meteor 3.0. But the async data support in React is only available in a canary version for React 18 (already available in React 19 RC): use – React

P.S. React Router 6.4 might already be using use. It’s just so difficult to move to routing-based data fetching in React Router coming from a component-based data fetching pattern

1 Like