Next.js Discord

Discord Forum

Page crashing without throwing any error

Answered
Longtail tuna posted this in #help-forum
Open in Discord
Longtail tunaOP
I've been facing a navigation issue in a Next.js application I'm building. Sometimes, when I click on an internal link, the page takes a very long time to load — even for pages I visited just a few seconds earlier.

Occasionally, it gets even worse: the page crashes and turns completely gray. During these moments, no errors are shown at all — neither on the client side nor the server side.

Has anyone experienced something similar or have any idea what might be causing this?

Thanks in advance!

somedependecies i'm using:
json 
"dependencies": {
    "@headlessui/react": "^2.2.4",
    "@prisma/client": "^6.8.2",
    "@tanstack/react-table": "^8.21.3",
    "better-auth": "^1.2.8",
    "clsx": "^2.1.1",
    "lucide-react": "^0.511.0",
    "next": "15.3.2",
    "puppeteer-core": "^24.9.0",
    "react": "^19.1.0",
    "react-dom": "^19.1.0",
    "swr": "^2.3.3",
    "zod": "^3.25.30"
  }
Answered by Longtail tuna
I think I figured it out!

After hours of deleting and editing components, I think I finally found the issue.

I have a navbar that I built using Parallel Routes Slots, the idea was to make the navbar server-side while still allowing some customization depending on the route. But it seems like it was causing a weird bug whenever I rendered my main route with any Client Component at some paths alongside that navbar Slot.

I think it had something to do with the default.tsx component, because after I created a more specific Slot for the problematic route, the freezing issue stopped happening.
View full answer

13 Replies

@Dutch have you checked browser console
Longtail tunaOP
My man @Dutch ! How's it going?
So, I left the application running for a while to try and catch any errors/logs. At some point, I got an out of memory error:
FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
Now I'm trying to understand what caused it... I've never seen anything like this before with Next.js, this week’s just cursed, I guess 😦
Silver carp
this just sounds like some infinite loop
probably useEffect because this is navigation related
If you're using hooks, I'd try to manually test them to determine the one at fault
@Dutch Have you CHECKED browser console (:
Longtail tunaOP
yes, but no errors
@Silver carp If you're using hooks, I'd try to manually test them to determine the one at fault
Longtail tunaOP
Hi!
Thanks for the tip, but I'm only using useEffect once in the entire codebase. I added a console.log inside it, and it's not running in an infinite loop.
@Dutch Can you show some component code
Longtail tunaOP
I think I figured it out!

After hours of deleting and editing components, I think I finally found the issue.

I have a navbar that I built using Parallel Routes Slots, the idea was to make the navbar server-side while still allowing some customization depending on the route. But it seems like it was causing a weird bug whenever I rendered my main route with any Client Component at some paths alongside that navbar Slot.

I think it had something to do with the default.tsx component, because after I created a more specific Slot for the problematic route, the freezing issue stopped happening.
Answer
Longtail tunaOP
maybe I gonna try another way to make this navbar later to avoid this type of error and make it more simple
@Dutch awesome, let me know if you stuck
Longtail tunaOP
thank you!