前端开发

nextjs-turbopack

affaan-m/ecc

Next.js 16+ and Turbopack guidance — incremental Rust bundling, file-system caching, faster dev startup and HMR, Turbopack vs webpack tradeoffs, and the middleware.ts to proxy.ts filename change. Use when developing or debugging Next.js 16+ apps, diagnosing slow dev startup or hot reload, choosing between bundlers, or reviewing middleware/proxy file naming.

  • 5247 次安装
  • 29.2万 星标
  • 收录于

安装命令

npx skills add https://github.com/affaan-m/ecc --skill nextjs-turbopack

SKILL.md

Next.js and Turbopack

Next.js 16+ uses Turbopack by default for local development: an incremental bundler written in Rust that significantly speeds up dev startup and hot updates.

When to Use

  • Turbopack (default dev): Use for day-to-day development. Faster cold start and HMR, especially in large apps.
  • Webpack (legacy dev): Use only if you hit a Turbopack bug or rely on a webpack-only plugin in dev. Disable with --webpack (or --no-turbopack depending on your Next.js version; check the docs for your release).
  • Production: Production build behavior (next build) may use Turbopack or webpack depending on Next.js version; check the official Next.js docs for your version.

Use when: developing or debugging Next.js 16+ apps, diagnosing slow dev startup or HMR, or optimizing production bundles.

How It Works

  • Turbopack: Incremental bundler for Next.js dev. Uses file-system caching so restarts are much faster (e.g. 5–14x on large projects).
  • Default in dev: From Next.js 16, next dev runs with Turbopack unless disabled.
  • File-system caching: Restarts reuse previous work; cache is typically under .next; no extra config needed for basic use.
  • Bundle Analyzer (Next.js 16.1+): Experimental Bundle Analyzer to inspect output and find heavy dependencies; enable via config or experimental flag (see Next.js docs for your version).