Hey there,
I recently started to use the server render. I’m using react and my client side state is handled in a redux store. Although the subscribed data is only kept in my minimongo and not stored in the redux store. I got it to work so far, but currently I’m struggling a bit with the “flashing” Problem because of subscriptions. The following situation:
- Client requests site from the Server
- Server is rendering the application and sends the complete markup to the Client
- Client displays the application correctly
- Then the js files are loaded and the client side rendering starts
- The .subscribe is called and since the required data is not yet available in the client side collection the application gets rerendered where a loading icon is shown
- As soon as the data is in the client side collection the correct markup from before is shown
What is the best way to approach this issue?
I had the following idea:
- Server renders the application and sends the data to the client
- As soon as the client has the js files available it hydrates the minimongo collections
-> So far my approach was working. Unfortunately the client also receives the same data shortly after from the server and I receive the following error message: “Uncaught Error: Expected not to find a document already present for an add […]”. It makes sense, since the data is indeed already there. Is there an option to catch these errors?
Would you somehow differently approach the flashing problem? Other options I might think of:
- Delay the render
- Store the collection data in the redux store
Would be great to hear about your solutions.
Best regards,
HK
