Support for multiple loadable components on same page

[debugpai]

Hello everyone,
First of all I would like to thank you for such a great library.

We have a requirement where we would like to build a component service. The user can make a request for a particular component and the server returns the html and assets required to render it.

In the server we run extractor.collectChunks and return the things needed for a particular component. I wanted to know if we can have multiple chunks collected in this way from the same server be used on the client. Some problems that I am anticipating:

• extractor.getScriptTags() returns a script tag with id="__LOADABLE_REQUIRED_CHUNKS__. This looks like it won't scale for multiple components on the same page
• In @loadable/component we have this code which checks if that script tag is loaded before hydrating the component

I wanted to know if my assumptions are right that multiple components on same page are not supported by loadable. If yes then I wanted to know if you would be interesting in including this feature in loadable. I would be willing to help implement this feature in that case (with some guidance of course).

[gregberge]

Hello @debugpai, by multiple components you mean multiple React applications on the same page? If you are talking about that that, yes I think it is not supported right now. You could probably do it by yourself but you have to use internal methods for that and don't use the webpack plugin. See https://github.com/smooth-code/loadable-components/blob/master/packages/server/src/ChunkExtractor.js#L318.

We could add support for that in the core of Loadable Components, but for now, you should try to implement it by yourself, test it and then submit a PR.

Thanks!

[debugpai]

Hey @neoziro. I have created a PR #317 to add support for multiple react applications. Please go through it and tell me if it needs any further changes.