Questions on the `preload` functionality
I am reading the docs on the
The doc says there are some caveats to be aware of when using
I have a few question questions about these text:
1. The
2. I don't really understand "The resources can avoid refetching if they serialized their data in the server render" --> What/why/how is this refetching behavior? Why does serializing the data in the server render prevent this refetching? How do I "serialize data in the server render"
preload functionality and the related query function. The doc says there are some caveats to be aware of when using
preload, specifically1. Thepreloadfunction is called once per route, which is the first time the user comes to that route. Following that, the fine-grained resources that remain alive synchronize with state/url changes to refetch data when needed. If the data needs a refresh, the refetch function returned in the createResource can be used.
2. Before the route is rendered, thepreloadfunction is called. It does not share the same context as the route. The context tree that is exposed to thepreloadfunction is anything above thePagecomponent.
3. On both the server and the client, thepreloadfunction is called. The resources can avoid refetching if they serialized their data in the server render. The server-side render will only wait for the resources to fetch and serialize if the resource signals are accessed under a Suspense boundary.
I have a few question questions about these text:
1. The
preload function is called once per route, but then paragraph (3) says "on both the server and the client, the preload function is called" --> So that's actually twice ? Also why both the server and the client? Aren't server enough for rendering the page content?2. I don't really understand "The resources can avoid refetching if they serialized their data in the server render" --> What/why/how is this refetching behavior? Why does serializing the data in the server render prevent this refetching? How do I "serialize data in the server render"
