Duplicate Requests in Next.js vs 14 on server side with Parallel Routes and Intercepting Routes

[Semmy99]

Summary

I'm using Next.js 14 and encountering an issue where my requests are being duplicated when using parallel routes and intercepting routes.

I'm not using useEffect and the RootLayout component is only supposed to render once. However, the fakeRequest is being made twice. What could be causing these duplicate requests and how can I prevent them?
I've discovered that a problem arises when using parallel routes and intercepting routes in Next.js.

Any insights or solutions would be greatly appreciated!

Additional information

No response

Example

https://codesandbox.io/p/devbox/nextjs-test-fkl7l5

[hyjoong]

I think your environment is in development mode, causing components to render twice due to React's Strict Mode. This might be causing the fakeRequest function to be called twice. To resolve the issue, try testing in production mode.

pnpm build && pnpm start

[Semmy99]

@hyjoong It seems to me that this is not the issue. It's very strange. Because if I delete the "@modal" folder, the problem disappears. Probably, if the problem were in the development mode, it should work regardless of whether I have a parallel route or not.

Maybe it's a bug? I don't know.

[hyjoong]

@Semmy99 I understand what you're saying. You observed that the console.log statement is executed only once when you don't use parallel routes, but it appears twice when you do. This might lead you to believe that the parallel routes are causing duplicate requests. However, in the development environment, components can render twice due to React's Strict Mode.

I suggest testing in the production environment after building your application. If the console.log statements are still executed twice only with parallel routes in the production environment, it might be a bug.

[Semmy99]

@hyjoong thank you. I attempted to resolve the issue by running npm run build and npm run start, but the problem persists.

[Felipe-Rodr]

Having the same issue here. When using parallel routes and rendering them in the layout component, requests are doubled for some reason. For me it happened when using two or more parallel routes. transforming the routes back to basic components solved the issue.