Remix [1] solves this problem very well. Data that is needed by a React component is declared in the same file as the component as a loader function which the

Remix [1] solves this problem very well. Data that is needed by a React component is declared in the same file as the component as a loader function which the server then invokes and renders into the component on the server so the client receives an HTML response with the view ready to go (server side rendering). I distinguish between server side rendering which is a function invocation that takes place for each request as opposed to pre built HTML which isn't "rendering" anything and instead returning a static, pre-generated file. With Remix, the client gets an HTML response the server generated with all the data it needs already retrieved (it was retrieved on the server). The client can then run any additional client side JS but the user doesn't need to wait on the client side JS to see the content they were trying to browse. Remix can easily be deployed to edge systems like cloudflare workers. The services that the loader functions hit can be run somewhere else of course as well. [1] remix.run