Why not call a fetch function eagerly when it is not even awaited

I get this message in my terminal when running my svelte frontend: ``` Avoid calling `fetch` eagerly during server side rendering — put your `fetch` calls inside `onMount` or a `load` function instead ``` I understand what it says and I can definitely put it in an onMount function, however, I don't see the meaning of it. Imagine this example application, that is close to how I use it: ``` <script lang="ts"> let response: Promise<string> = $state(loadData()); async function loadData(): Promise<string> { const response = await fetch("http://my_endpoint"); return response.json(); } </script> {#await response} LOADING {:then response} {response} {/await} ``` What I am trying to point at is that the async function `loadData` is not awaited in the script tag. Only via the await directive in the template. I don't see how this could be blocking more than any other normal function call. I wonder if that is just a case that was overlooked when programming this warning or if I create a real mistake that will bite me in the ass in a larger project.