Hello everyone,
We successfully upgraded to Meteor 3 recently at Orderlion - great job dear Meteor team with this, it worked really well!
We have certain pages/routes, where SEO and loading time really matter. For these few routes, we would love to use React SSR.
I made something like this work:
app.get('/my-ssr-route', (req, res) => {
// const entryPoint = ['/client.js'];
const { pipe, abort: _abort } = ReactDOMServer.renderToPipeableStream(
<StaticRouter>
<SSRAppRoot /> // this is just my test React component
</StaticRouter>,
{
// bootstrapScripts: entryPoint,
onShellReady() {
res.statusCode = 200;
res.setHeader('Content-type', 'text/html');
pipe(res);
},
onShellError() {
res.statusCode = 500;
res.send('<!doctype html><p>Loading...</p>');
}
}
);
});
The issue is this: I can not, in any way, hydrate
the react components afterwards on the client. In other words: the page is completely static, no functionality whatsoever!
As I understand it, one needs to use the bootstrapScripts
param to pass paths to basically bundled react client JS bundles to also have client functionality.
But how would I do this? Is there even a way to achieve this? Since there is no webpack in place or anything like that, which path would I put there? Any clever ideas anyone?!
One more thing: we do NOT want to put the path to the one big meteor.js bundle there. This would defeat the whole purpose of having a quickly loading page, because the big bundle, obviously, contains our whole huge meteor app. This is not the point! We would like to somehow only bundle React and that one root component (and its children) to have React functionality on the client.
Thanks very much in advance everyone, best
Patrick