Vercel نسخه Next.js 16.3 را عرضه کرد و با این کار، Turbopack و Partial Prerendering را از بخش آزمایشی خارج کرده و به حالت آماده برای تولید (production-ready) منتقل کرد. این بهروزرسانی نویدبخش بیلدهایی است که برای اپلیکیشنهای متوسط دو تا پنج برابر سریعتر هستند و سرعت بارگذاری صفحات را با کاهش ۴۰ تا ۶۰ درصدی در Time to Interactive بهبود میبخشد؛ افزایشی که هر تیمی که برای عرضه سریع ویژگیهای جدید در رقابت است، متوجه آن خواهد شد.
چرا این تغییر در حال حاضر اهمیت دارد
Next.js مدتهاست که برای هر دو بیلد توسعه و تولید، به Webpack (یک باندلر جاوااسکریپت که با جاوااسکریپت نوشته شده) متکی بوده است. در طول سال گذشته، تیم Vercel روی Turbopack، جایگزینی مبتنی بر Rust که مصرف حافظه را کاهش داده و سرعت بیلد را بالا میبرد، کار کرده است. همزمان، آنها Partial Prerendering (PPR) را به عنوان روشی برای ترکیب HTML استاتیک با محتوای داینامیک در لحظه آزمایش کردند، اما توسعهدهندگان باید با آن مانند یک «آزمایش اختیاری» برخورد میکردند. با ارتقای هر دو به حالت پایدار (stable)، Vercel به تیمهای عملیاتی یک ارتقای عملکرد آماده بدون آزمون و خطاهای معمول ارائه میدهد.
پایداری Turbopack
- سرعت: بیلدهای تولید در مخازن (repositories) متوسط اکنون دو تا پنج برابر سریعتر اجرا میشوند.
- حافظه: فشار بر حافظه را در کدبازهای (codebases) بزرگ کاهش میدهد.
- فعالسازی: کافی است
turbo: trueرا بهnext.config.jsاضافه کنید.
این تغییر یک محیط سختگیرانهتر ایجاد میکند. Turbopack به Node 18.17 یا جدیدتر نیاز دارد و هر پلاگین سفارشی Webpack که پروژهها به آن وابسته هستند، در Turbopack اجرا نخواهد شد. تیمهایی که خط لولههای (pipelines) گستردهای از پلاگینها دارند، باید پیش از فعالسازی، آن افزونهها را بازبینی یا بازنویسی کنند.
بهبود عملکرد Server Actions
Server Actions — توابعی که روی سرور اجرا میشوند اما از سمت کلاینت فراخوانی میشوند — اکنون از یکپارچگی دقیقتر با TypeScript بهره میبرند. کامپایلر انواع (types) را به طور خودکار استنتاج میکند، بنابراین توسعهدهندگان میتوانند از نوشتن دستی Type Annotations صرفنظر کنند. همچنین این سیستم، اشیاء تو در تو (nested objects) و طرحوارههای (schemas) Zod را به طور کامل درک میکند و عدم تطابق در زمان اجرا (runtime mismatches) را کاهش میدهد. قراردادهای جدید سیستم فایل، تعیین Actionها را صریحتر کرده و به توسعهدهندگان کمک میکند تا از باگهای ظریف ناشی از Importهای مبهم جلوگیری کنند.
Partial Prerendering (PPR) آماده استفاده در محیط عملیاتی است
PPR به یک صفحه اجازه میدهد تا بخشهایی که هرگز تغییر نمیکنند را با HTML استاتیک سرو کند، در حالی که بخشهای داینامیک را به طور جداگانه Hydrate میکند. مارکآپ استاتیک بلافاصله نمایش داده میشود؛ سپس یک fetch در پسزمینه، بخشهای تعاملی را فعال میکند. این رویکرد Time to Interactive (TTI) را تا ۴۰–۶۰٪ بهبود میبخشد.
پیادهسازی PPR ساده است: بخشهای استاتیک را با API موجودِ تولید استاتیک (static generation API) مشخص کنید و اجازه دهید بخشهای داینامیک به رندرینگ سمت کلاینت (client-side rendering) بازگردند. از آنجایی که HTML استاتیک به عنوان یک سند کامل فرستاده میشود، مرورگر میتواند قبل از اجرای هرگونه جاوااسکریپت، رندر کردن را شروع کند که باعث افزایش عملکرد درکشده (perceived performance) در شبکههای کند میشود.
سایر تغییرات قابل توجه
- بهینهسازی تصویر: اکنون میتوان
fetchPriorityرا روی تصاویر LCP (Largest Contentful Paint) تنظیم کرد تا اطمینان حاصل شود که مرورگر ابتدا تصویر اصلی (hero image) را دریافت میکند. - مدیریت فونت:
next/fontبه طور خودکار زیرمجموعههای کاراکترها (subsets) را ایجاد میکند و بدون تنظیمات اضافی، حجم Payload را کاهش میدهد. - Middleware: موتور تطبیق (matching engine) با Rust بازنویسی شده است که بررسی مسیرها (route checks) را سریعتر میکند. Middleware همچنین میتواند پاسخهای کامل HTML برگرداند که راه را برای صفحات Edge-rendered باز میکند.
گامهای فوری برای تیمها
- فعال کردن Turbopack در محیط توسعه؛ پس از تنظیم پرچم
turboدر محیط تولید نیز به همین شکل عمل میکند. - ارتقای Node به نسخه ۲۰ یا بالاتر.
- بازبینی Server Actions برای بهرهمندی از مزایای استنتاج نوع (type-inference)؛ هرگونه Annotation دستی که اکنون زائد است را حذف کنید.
- اجرای آزمایشی Partial Prerendering روی یک مسیر (route) با ترافیک بالا برای اندازهگیری بهبود TTI قبل از پیادهسازی در کل سایت.
هشدارها و نکات قابل توجه
دستاوردهای عملکردی به رعایت الزامات زمان اجرای (runtime) جدید بستگی دارد. پروژههایی که روی نسخههای قدیمی Node ماندهاند یا وابستگی زیادی به پلاگینهای سفارشی Webpack دارند، با مشکل مواجه خواهند شد.
خلاصه کلام: Next.js 16.3 یک باندلر با سطح تولید و قدرت Rust و یک روش اثباتشده برای ترکیب محتوای استاتیک و داینامیک را در اختیار توسعهدهندگان قرار میدهد. همین حالا پیشفرضهای جدید را بپذیرید، شکافهای سازگاری را برطرف کنید و خواهید دید که بیلدها سریعتر تمام میشوند و صفحات برای کاربران نهایی به طرز محسوسی سریعتر و روانتر میشوند.