Server side rendering with fetched data about react-async-component HOT 8 CLOSED

I have some interesting ideas around this, and actually have another library that helps with this (react-jobs). Under the hood that library and this one both use react-tree-walker so I am thinking allowing for an integration layer to exist between multiple libraries that use react-tree-walker. In this way you could resolve multiple async units from either react-async-component or react-jobs and not have to worry about which one would get resolved first etc etc.

Stay tuned.

from react-async-component.

Interestingly though as you are returning a promise you could have a step within the promise chain that does data loading (e.g. a redux-thunk that returns a promise), before finally resolving the component.

This would be a pure react-async-component implementation then, but I haven't had time to play with this idea either.

from react-async-component.

Cool, thanks!
Will try both these ways.

from react-async-component.

@xmityaz let me know how you got on. It would be great to take your pain points under consideration for when I try out my solutions. 😀

from react-async-component.

I've switched to react-jobs library. It actually more suitible for my project at this point and it works great. It would be great to see the combination of these two libraries throught.
I've also tried to solve my problem with data fetching in promise chain in react-async-component, but it didn't work for me (unfortunatelly I don't remember the exact reason 🙂)

from react-async-component.

FYI to everyone, you don't need to use react-jobs. You can provide your own implementation using the API provided by react-async-bootstrapper. It will interop with this library. :)

from react-async-component.

@ctrlplusb can you give example of this together with async component? Atm we have separate await for data loading promises using custom hoc. Would like to see how this can be simplified

from react-async-component.

I have another problem with SSR and code split. I wonder if anybody else is seeing it?

So I did prerendering, and I have code splitting and I have <link rel="preload"> to speed up download of chunks. But the problem is that async component loading triggers redraw of pre-rendered content. Did you see something like this?

P.S. Full code here https://github.com/stereobooster/an-almost-static-stack, I use react-loadable, not react-async-component, but I suppose it will be the same for any "loadable" solution.

from react-async-component.