Next.js 16.1 منتشر شد؛ معرفی امکانات جدید و بهبودهای مهم

 نسخه Next.js 16.1 با تمرکز بر بهبود سرعت فرایند توسعه و افزایش پایداری منتشر شده و به‌روزرسانی‌های مهمی برای Turbopack و ابزارهای مرتبط ارائه می‌دهد. 

ویژگی‌های اصلی نسخه Next.js 16.1

• کشینگ (File System Caching) برای next dev در Turbopack (پایدار): زمان کامپایل در حالت توسعه به‌طور قابل‌توجهی سریع‌تر شده است.
• ابزار تحلیل بسته‌ها (Bundle Analyzer) در حالت آزمایشی: ابزاری تعاملی برای بهینه‌سازی اندازه بسته‌ها ارائه شده است.
• اشکال‌زدایی ساده‌تر: اجرای دیباگر Node.js با --inspect در next dev ممکن است.
• پشتیبانی از وابستگی‌های خارجی گذرا (Transitive external dependencies): Turbopack اکنون می‌تواند این وابستگی‌ها را بدون هشدار مدیریت کند.

ارتقا به نسخه جدید 

 برای ارتقا به Next.js 16.1 می‌توانید از یکی از روش‌های زیر استفاده کنید: 
 

# use the automated upgrade CLI
npx @next/codemod@canary upgrade latest

# ...or upgrade manually
npm install next@latest react@latest react-dom@latest

# ...or start a new project
npx create-next-app@latest

Turbopack File System Caching برای next dev

کشینگ Turbopack در سیستم فایل برای فرمان next dev اکنون پایدار است و به‌صورت پیش‌فرض فعال شده است. این ویژگی باعث می‌شود که آرتیفکت‌های (Artifacts) کامپایلر روی دیسک ذخیره شوند و در نتیجه زمان کامپایل هنگام راه‌اندازی مجدد سرور توسعه بسیار سریع‌تر شود(به‌خصوص در پروژه‌های بزرگ).

ابزار Bundle Analyzer برای Next.js (در حالت آزمایشی)

 در Next.js 16.1 ابزاری جدید به نام Next.js Bundle Analyzer معرفی شده که با Turbopack کار می‌کند. این ابزار به شما کمک می‌کند تا اندازه بسته‌ها (Bundle) را برای کدهای سمت سرور و کلاینت بهینه کنید. این موضوع می‌تواند به بهبود Core Web Vitals، کاهش زمان شروع سرورهای بدون فعال بودن قبلی (cold start)، و شناسایی وابستگی‌های بزرگ و غیرضروری کمک کند.

 برای اجرای ابزار: 

# terminal
 next experimental-analyze

 اجرای این دستور، یک رابط کاربری تعاملی باز می‌کند که در آن می‌توانید: 

• بسته‌ها را بر اساس Route فیلتر کنید.
• زنجیره واردات (import chain) را ببینید و دلیل قرارگیری هر ماژول را بررسی کنید.
• واردات بین کامپوننت‌های Server و Client را دنبال کنید.
• اندازه‌های CSS و دیگر فایل‌های واردشده را مشاهده کنید.
• بین نمای Server و Client جابه‌جا شوید.

این ابزار هنوز در مراحل اولیه توسعه است و در نسخه‌های بعدی بهتر خواهد شد.

اشکال‌زدایی ساده‌تر با next dev --inspect 

در این نسخه می‌توانید با پاس دادن فلگ --inspect به فرمان next dev، دیباگر Node.js را فعال کنید. قبلاً برای این کار باید از NODE_OPTIONS=--inspect استفاده می‌شد که روی همهٔ پردازش‌های ناشی از Next.js تاثیر می‌گذاشت؛ اما حالا این کار فقط روی پردازشی که کد شما را اجرا می‌کند انجام می‌شود. 

بهبود مدیریت serverExternalPackages 

Next.js اجازه می‌دهد تا وابستگی‌ها را بدون بسته‌بندی (unbundled) نگه دارید با استفاده از گزینه serverExternalPackages. قبلاً این گزینه فقط برای وابستگی‌های مستقیم به‌طور قابل‌اعتماد کار می‌کرد.

مثلاً اگر کتابخانه‌ای به طور غیرمستقیم به چیزی مثل sqlite وابسته بود و شما می‌خواستید sqlite را external کنید، مجبور بودید آن را در package.json خود اضافه کنید - که می‌توانست باعث وابستگی‌های پیچیده و مشکلات نسخه شود.

در Next.js 16.1 این موضوع برای Turbopack برطرف شده است و اکنون به‌درستی وابستگی‌های گذار (Transitive) را بدون نیاز به پیکربندی اضافی مدیریت می‌کند.

سایر به‌روزرسانی‌ها

• سایز نصب‌ها حدود ۲۰ مگابایت کمتر شده است، به دلیل ساده‌سازی لایه کشینگ
• فرمان جدید next upgrade اضافه شده تا ارتقا نسخه‌های Next.js آسان‌تر شود.
• ابزار get_routes در سرور DevTools MCP اضافه شده تا فهرست کامل Routes برنامه را به دست آورید. 
• زمان صرف‌شده برای generateStaticParams اکنون به‌عنوان بخشی از زمان‌های نشان‌داده‌شده در توسعه لاگ می‌شود. 
• لاگ‌گیری Worker در next build به‌روزرسانی شده تا تعداد Threadها را نمایش دهد.
• باندلینگ Improved async imports در توسعه بهتر شده تا تعداد Chunkهای تولیدی کاهش یابد.
• مسیرهای Source Map نسبی برای کدهای سمت سرور تولید می‌شود تا سازگاری با Node.js و ابزارهای اکوسیستم بهتر شود.