Houdini load functions creating stores and slowing website down

[RoyalFoxy]

Describe the bug

The bug occurs when using load functions too many times without reloading the page and having them accumulate over time. It extremely slows down the entire page and freezes everything.

How to reproduce

• Create a complex graphql type and query
• Call the load function a ton of times
• Refetch with an existing store or with a load function and make it network only to force a refetch
• The website will freeze for a bit

I've built a small reproduction which includes a small backend and a svelte-kit frontend. To run the backend you need bun (the js runtime) install and run bun dev inside the graphql-api folder and for the frontend just run npm run dev. Reproduction

On my hardware I could see a significant slowdown when setting the listener amount to 100 and the order amount to 100 as well and loading 1000 times aka the default. Pressing the Loads: N button calls the load_ActiveOrderStore as many times as the slider Amount per load call is set to. Initially the Force refetch button completes really quickly and you can see Fetching to flicker a bit when pressing the button. After you called the load function once or twice with your preferred setting (doing it too many times may freeze the page for minutes) you can press the Force refetch button again and it should take a noticeable amount of time longer.

The attached Stackblitz is a lot weaker and even with the default settings it get frozen after just 1 load loop.

What I believe the bug is, is that the load function creates a new store every time and appends it to some list or map that gets checked whenever that type data changes and all the stores that were created have to be updated so the more stores you have the longer it will take. Also replacing the load functions with a simple refetch makes it a lot faster and would only change the fact that no new store is created.

If you need any more information I'm happy to help further

Reproduction

https://stackblitz.com/~/github.com/RoyalFoxy/Houdini-bug-reproduction

[AlecAivazis]

Looking at your reproduction, the issue is that you are using a load_ function inside of a +page.svelte which like you say will create a new store every time the component runs. These functions are only intended to be used inside of a SvelteKit load function.

To fix the issue, I would recommend instead to instantiate the class explicitly and calling fetch.

[RoyalFoxy]

I guess this wasn't the best reproduction but I it also happens if you for example call a load function in a +page.ts, you have prefetching on and you repeatedly hover over a link to that route to call the +page.ts. As soon as you update the data of one of those stores the entire website freezes as well and it's the same issue

[RoyalFoxy]

The problem really is that every time any load function gets called a new store is created regardless if one already exists for that type. This affects both +page.svelte and +page.ts. Even layouts are affected