react-frontload
react-frontload copied to clipboard
Ability to disable SSR via prop
In v1 version of this library there was a prop to disable SSR. It was very useful to me. Is it possible to add it again or can you suggest some other quick and convenient workaround?
Hi, I have a project which used this feature and I thought I would share my workaround in case anyone finds it useful.
Previously, my project (using ReactJS and Redux) was using v1.0.6 and the Frontload component was passed a boolean: noServerRender={noSsr} I updated to v2.0.0 and found that wasn't supported any more. In fact, without a server side render, I found frontloadMeta.serverRendered was set to true so frontload didn't actually resolve any of the promises.
I traced the problem to: src/index.tsx:406
const serverRendered = frontloadState.isFirstRender()
This sets serverRendered to true if this is the first render. That seems like a bug to me but may be correct in other situations. Anyway I created a function to override isFirstRender and provide whatever logic I want:
var createClientFrontloadState = ((_super) => { return (args) => { var state = _super(args); state.isFirstRender = () => state.serverRender !== undefined && state.serverRender.pass > -1; return state; } })(createFrontloadState.client)
Then instead of:
var frontloadState = createFrontloadState.client({ context: { api: true}, logging: true });
You can use:
var frontloadState = createClientFrontloadState({ context: { api: true}, logging: true });
One thing to note is that state.isFirstRender returns false unless state.serverRender.pass is greater than -1. That's technically the wrong way round. It should return false if a serverRender is detected.
It's possible, in future src/index.tsx:406 becomes:
const serverRendered = !frontloadState.isFirstRender()
At which point, I would need to change createClientFrontloadState so state.isFirstRender returns the opposite.
I hope that helps someone.