What is the recommended way to fetch and invalidate data for a component?

[alissa-tung]

Hello, I am writing an single page application. In this application I have many components, and some of the components needs to fetch data, nearly one data source per component.

I had tried to write the application using the SvelteKit load function. But refresh and invalidate becomes a problem. When the condition change, I just want to re-run exactly the one corresponding data fetching function, but not the whole load function which could invoke many network requests.

What is the proper way for doing this? I had already made all components pure, that is, no internal state, the can render by $props().

In addition what I am looking for in React is exactly useSWR.

Thank you!

[david-plugge]

Take a look at svelte-query. Its a pretty nice solution for spas (once you want ssr, it gets a little cumbersome)

[alissa-tung]

thank you