Question 245979 in SEO Question posted in
Some basic information to get you started with this can be found here.

Seo – Why fetch data in `load` when I can fetch data in `{#await}` or `onMount` which hit `+server` in sveltekit

keyword: show spinner

Suppose when I hit a route, e.g. /dashboard, most of the page content is static but a few sub-components need real time data. If I fetch data in a load function, the whole route can’t display anything until data is ready.

Alternatively, I can fetch data in onMount or {#await} with the benefit of showing a spinner. (if the fetching must happen on server side, I can fetch from an api route)

So when is the load good? Is it just for clients with slow internet and clients without javascript, and for SEO?

Tags:

2

Answers


  1. 0

    Don’t blame the client, your application might be too slow if you need a spinner 😅

    Of course there are cases where things might take longer, and something like that might be appropriate, but there often are things that come from the server that are fast to load which saves a round trip which would even be delayed by the rest of the page loading in.

    E.g. data about the current user required for some user menu/avatar should not need to block the rest of the page.

    I would

    • See how long something takes to load and if it hardly registers use load (page or layout)
    • Possibly optimize it if it is slow and can be optimized
    • Load separately if it really has to remain slow
    Login or Signup to reply.
  2. 0

    You should use load() for essential data. onMount() requires JavaScript, so it will not be called if JavaScript is disabled or otherwise broken.

    You may use onMount() if you are OK with the data not always being loaded. (In your case, it will just be "stuck" at the loading spinner. Try disabling JS to see what it would look like.)

    Streaming with promises, an alternative to the onMount() method you described, just landed in SvelteKit. It allows you to await long-running promises from +page.svelte (if the promise is not at the top-level). Note this requires both JavaScript and a platform that supports streaming (AWS Lambda and similar serverless platforms do not support streaming.)

    Finally, there may still be a +loading.svelte feature on the SvelteKit roadmap. (I’m not sure if streaming with promises ended up being the feature discussed here: https://www.youtube.com/watch?v=N4BRVkQVoMc&t=6993s)

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search