Parallel routes data fetching
Unanswered
Black-chinned Hummingbird posted this in #help-forum
Black-chinned HummingbirdOP
Hello Next.js users,
Today, I had an epiphany while working with Parallel Routes, where each of the "Slots" has its own data-fetching function using async. Due to the nature of async and the layout structure of Parallel Routes, the data is fetched sequentially rather than in parallel, leading to longer data-fetching times in my dashboard.
Is there a known way to leverage the benefits of Parallel Routing while ensuring that data is fetched in parallel?
Any help or guidance would be greatly appreciated!
Today, I had an epiphany while working with Parallel Routes, where each of the "Slots" has its own data-fetching function using async. Due to the nature of async and the layout structure of Parallel Routes, the data is fetched sequentially rather than in parallel, leading to longer data-fetching times in my dashboard.
Is there a known way to leverage the benefits of Parallel Routing while ensuring that data is fetched in parallel?
Any help or guidance would be greatly appreciated!
6 Replies
Giant resin bee
Haven't worked with parallel routes, but what if you remove the parallel route and put all slots in one page
and then fetch all of the data using Promise.all() and then destructure the data from the array and pass it to the relevant child component ( which was previously a slot)
and then fetch all of the data using Promise.all() and then destructure the data from the array and pass it to the relevant child component ( which was previously a slot)
@Giant resin bee Haven't worked with parallel routes, but what if you remove the parallel route and put all slots in one page
and then fetch all of the data using Promise.all() and then destructure the data from the array and pass it to the relevant child component ( which was previously a slot)
Black-chinned HummingbirdOP
Had thought about doing this.. I would love to keep using the benefits that parallel routes provide but it seems there isnt a solution to this issue yet. Kind of a catch to call them parallel routes when they are not if data fetching is used.. ☹️
@Giant resin bee Haven't worked with parallel routes, but what if you remove the parallel route and put all slots in one page
and then fetch all of the data using Promise.all() and then destructure the data from the array and pass it to the relevant child component ( which was previously a slot)
Black-chinned HummingbirdOP
thanks though!
Black-chinned HummingbirdOP
My bad it seems that I was mistaken. The routes are being rendered in parallel and the data fetched is also in parallel. It seems all the routes are being re-rendered or refetched 3 times, (there are 3 slots) there are 3 rsc get requests logged in my console which i initially associated with the data fetches but I can see 3 console logs being made per fetch.
researching and will reproduce..
researching and will reproduce..
Black-chinned HummingbirdOP