Next 14 is painfully slow

[artrixdotdev]

Summary

Recently, i feel like nextjs is getting slower... like a LOT slower, back in next 12 hot reload and response times where around 300ms to 1.1 seconds MAX. Now, just starting the server takes 15 seconds, and generating a single response its taking nearly a minute (sometimes more) and hmr flat out just doesnt work whatsoever. Ive tried using turbo but I dont think it works with my current stack.

Is this just me, or is this happening for everyone? Could it be due to the dependencies im using being chunky?

(heres my package.json)

{
    "name": "storygem",
    "version": "0.0.0",
    "private": true,
    "scripts": {
        "build": "next build",
        "db:push": "dotenv drizzle-kit push:mysql",
        "db:studio": "dotenv drizzle-kit studio",
        "dev": "next dev",
        "lint": "next lint",
        "start": "next start"
    },
    "dependencies": {
        "@planetscale/database": "^1.11.0",
        "@t3-oss/env-nextjs": "^0.7.0",
        "@tanstack/react-query": "^4.32.6",
        "@trpc/client": "^10.37.1",
        "@trpc/next": "^10.37.1",
        "@trpc/react-query": "^10.37.1",
        "@trpc/server": "^10.37.1",
        "@types/ua-parser-js": "^0.7.39",
        "class-variance-authority": "^0.7.0",
        "clsx": "^2.0.0",
        "drizzle-orm": "^0.28.5",
        "editor": "workspace: *",
        "lucide-react": "^0.292.0",
        "next": "^14.0.3",
        "react": "18.2.0",
        "react-dom": "18.2.0",
        "superjson": "^1.13.1",
        "tailwind-merge": "^2.0.0",
        "tailwindcss-animate": "^1.0.7",
        "ua-parser-js": "^1.0.37",
        "ui": "workspace: *",
        "zod": "^3.22.4"
    },
    "devDependencies": {
        "@types/eslint": "^8.44.2",
        "@types/node": "^18.16.0",
        "@types/react": "^18.2.33",
        "@types/react-dom": "^18.2.14",
        "@typescript-eslint/eslint-plugin": "^6.3.0",
        "@typescript-eslint/parser": "^6.3.0",
        "autoprefixer": "^10.4.14",
        "configs": "workspace: *",
        "dotenv-cli": "^7.3.0",
        "drizzle-kit": "^0.19.13",
        "eslint": "^8.47.0",
        "eslint-config-custom": "workspace:*",
        "eslint-config-next": "^14.0.3",
        "mysql2": "^3.6.1",
        "postcss": "^8.4.27",
        "prettier": "^3.0.0",
        "prettier-plugin-tailwindcss": "^0.5.1",
        "tailwindcss": "^3.3.5",
        "tsconfig": "workspace:*",
        "typescript": "^5.1.6"
    },
    "ct3aMetadata": {
        "initVersion": "7.23.1"
    },
    "packageManager": "[email protected]"
}

Additional information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP Thu Oct 5 21:02:42 UTC 2023
Binaries:
  Node: 21.1.0
  npm: 10.2.0
  Yarn: 1.22.18
  pnpm: 8.10.2
Relevant Packages:
  next: 14.0.3
  eslint-config-next: 14.0.3
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.2.2
Next.js Config:
  output: N/A

Running on WSL

Example

No response

[InTheRiches]

I have been having similar issues

[DejiAwoniyi]

Same issue here. It is ridiculously slow. And we just moved from another framework that was very fast

[yf-hk]

Which framework is that?

[chihabhajji]

10~s cold start time for an app with 4 routes !

[artrixdotdev]

I've narrowed down the issue a bit. It seems to specifically be slow on Windows WSL. when I run npm isntall in my normal windows terminal/powershell I get more reasonable start/response times.

Another fix was to use bun use bun --bun dev in wsl.

[JannikZed]

We see that also in production on vercel - the TTFB is a real pain! Edge functions, streaming, everything sounds so good, but in reality, this all sounds like BS.. its hard to compete to a single location PHP page currently :( hard to admit.

[IanMirandaDev]

Facing same issue beacause of Lucide React with dynamic imports.

Ref: lucide-icons/lucide#1576

[analog-sombra]

it's very big problem I created 4 web app at the same time in NextJS 14 and now I am in trouble. i will never use NextJs again, never ever.

[yf-hk]

What are you going to use? I'm looking for an alternative. My simple vite+react project runs extremely smoothly, and it can compile to static files. However I'm still looking for a framework since bare vite lack some features

[desmati]

Angular! for sure!

[terrylee21]

this year is 2025 and i have to maintain prj that was built with that kind of sh*t :))

[BodhiHu]

same issue here. the hmr took like ~50s for some small changes.
we used umijs before and it's much faster.

the ssr/streaming things are not so good, especially for some pure frontend stuff.

[artrixdotdev]

The solution is to move the project folder into the WSL folder itself. Apparently HMR and hot reloading in general is broken in WSL when trying to watch files in the windows file system. The problem seems to resolve itself after moving all my projects directly onto the linux filesystem

For most people your linux file system home folder should be at \\wsl.localhost\

[empz]

My code is on the WSL filesystem and it's still painfully slow. Over a minute to compile a single route...