#Infitify rendering time

1 messages · Page 1 of 1 (latest)

calm root
#

When I run "npm run dev" my next.js app cannot render localhost:8000/ and render time is infinite. How so? Im using FSD as project hierarchy.

stuck waveBOT
#

Hi @calm root. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

There are several known reasons why a Next.js dev server might start but never render your app. Here are the most common causes documented in the knowledge sources:

1. Stale .next Cache

A leftover or corrupted .next build cache can cause the dev server to hang. Try clearing it:

rm -rf .next
npm run dev

[Dev Server Hangs Issue]

2. Another Browser Tab with an Active HMR Session

If you previously ran npm run dev for another project and left that browser tab open, its active HMR (Hot Module Replacement) session can interfere with your current dev server, causing it to get stuck and never load.

Close all old browser tabs from previous dev sessions before starting a new one.

[Dev Server Hangs Issue]

3. Antivirus or Security Software

Antivirus tools can slow down or block file access, causing compilation to hang indefinitely. [Local Dev Guide]

  • Windows: Add your project folder to the Microsoft Defender exclusion list via Windows Security → Virus & threat protection → Manage settings → Add or remove exclusions.
  • macOS: Enable Developer Tools for your terminal via System Settings → Privacy & Security → Developer Tools.

4. Network Interface Issues (VPN / Ethernet)

Connecting to a specific network interface (e.g., a VPN) has been reported to cause the dev server to get stuck in the compilation stage with the page continuously loading. [Network Connection Issue]

Try disconnecting from VPN or switching network interfaces and restarting the dev server.

5. Infinite Rendering Loop (Code Issue)

#

If your app has an async component that ends up imported inside a client component tree (use client), this can cause an infinite rendering loop. [Infinite Rendering Loop]

Check your FSD hierarchy for any component that:

  • Is exported as async
  • Gets imported (directly or indirectly) inside a use client component

General Recommendation

Make sure you're on the latest version of Next.js and using Turbopack (the default bundler), as each new version includes performance and stability improvements:

npm install next@latest
npm run dev  # Turbopack is used by default

[Local Dev Guide]

If none of the above resolves your issue, the knowledge sources don't contain enough information specific to FSD (Feature-Sliced Design) project hierarchies to pinpoint a cause there. You may want to try reproducing the issue with a minimal Next.js project to isolate whether it's FSD-related or a general Next.js issue.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@calm root Kapa.ai is still learning and improving, please let me know how I did by reacting below.

calm root
#

no fucking way Pycharm + Node.js are using 10.4 GB of RAM

#

I hate capitalism and what it did to modern tech