sapper icon indicating copy to clipboard operation
sapper copied to clipboard

Improve handling of slow promises when doing SSR

Open dzbarsky opened this issue 3 years ago • 0 comments

Is your feature request related to a problem? Please describe. When server-rendering pages, blocking until preload promises resolve can delay showing the user any content. For example, imagine we need to make an API call that takes 800ms to render our page. If we attempt to make this call in preload, the user will see nothing until it's complete. If we make the call in onMount, we can't begin the API call until the page renders client-side.

Describe the solution you'd like I would like a way to be able to server-render default content while the promise has not resolved yet, and then once the server has resolved the promise, flush an extra <script> tag to the client which would trigger the component to re-render (perhaps by setting the data in a store, or a similar mechanism). For the situation described above, this would result in the 800ms counter starting at server render time, which will be significantly faster from the user's point-of-view.

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

How important is this feature to you? This will be pretty important for the next app I build, and I'm currently deciding if Svelte/Sapper is a good fit for me. From looking around a bit it seems https://indepth.dev/posts/1324/the-journey-to-isomorphic-rendering-performance describes what I want pretty well, but I think Svelte syntax is nicer and would prefer to stick with it if I can get the performance worked out.

Additional context I know Sapper is basically EOL due to Svelte-kit, so completely understand if you'd like to consider this for Svelte-kit instead. Would that be possible?

dzbarsky avatar Dec 03 '20 02:12 dzbarsky