Some single-spa applications may want to server render some or all of the child applications that are active for a url. How to pull that off is not decided, but here's what I'm thinking for it so far:
const location = {href: '/url#/hash', hash: '#/hash'};
// New API for single-spa returns an array of string names.
const activeAppNames = singleSpa.findActiveApplications(location);
// The serverRender API will load the app but will probably not bootstrap it and will definitely not mount it. Instead it will check
// for a new lifecycle method (serverRender?) on the application. If the lifecycleMethod exists, it calls it. If not, it returns an empty string
Promise
.all(activeAppNames.map(singleSpa.serverRender))
.then(serverRenderedHtmls => {
const finalHtml = serverRenderedHtmls.join("");
res.write(finalHtml);
})Advantages of doing it that way:
- The user of single-spa can control which applications to server render
findActiveApplications might have other use cases besides server rendering
Disadvantages:
- You have to load the child application before you even know whether it supports server rendering or not. I'm not sure how this would be solved in any other way, though, besides perhaps including some configuration during
declareChildApplication.
Some single-spa applications may want to server render some or all of the child applications that are active for a url. How to pull that off is not decided, but here's what I'm thinking for it so far:
Advantages of doing it that way:
findActiveApplicationsmight have other use cases besides server renderingDisadvantages:
declareChildApplication.