~2 دقیقه مطالعه • بروزرسانی ۶ آبان ۱۴۰۴
مقدمه
اپلیکیشنهای بزرگ و غنی از ویژگیها ممکن است در زمان توسعه یا ساخت نهایی، حافظه زیادی مصرف کنند. Next.js ابزارها و تنظیمات مختلفی برای مدیریت این موضوع ارائه میدهد.
۱. کاهش تعداد وابستگیها
هرچه تعداد پکیجهای نصبشده بیشتر باشد، حافظه بیشتری مصرف میشود. از ابزار Bundle Analyzer برای شناسایی وابستگیهای سنگین استفاده کنید و موارد غیرضروری را حذف نمایید.
۲. فعالسازی webpackMemoryOptimizations
از نسخه ۱۵ به بعد، میتوانید گزینه experimental.webpackMemoryOptimizations: true را در next.config.js فعال کنید تا مصرف حافظه کاهش یابد (با کمی افزایش زمان کامپایل).
۳. اجرای build با حالت debug حافظه
از نسخه ۱۴.۲.۰ به بعد، میتوانید دستور زیر را اجرا کنید:
next build --experimental-debug-memory-usageاین حالت اطلاعات حافظه را در طول build نمایش میدهد و در صورت نزدیک شدن به حد مجاز، snapshot حافظه گرفته میشود.
۴. ضبط heap profile
برای بررسی نشتی حافظه، دستور زیر را اجرا کنید:
node --heap-prof node_modules/next/dist/bin/next buildفایل .heapprofile تولید شده را در Chrome DevTools → Memory بارگذاری کنید.
۵. تحلیل snapshot حافظه
با استفاده از NODE_OPTIONS=--inspect میتوانید فرآیند را در DevTools بررسی کنید. همچنین میتوانید با ارسال سیگنال SIGUSR2 در حالت debug، snapshot حافظه بگیرید.
۶. استفاده از Webpack Build Worker
از نسخه ۱۴.۱.۰ به بعد، Webpack در یک worker جداگانه اجرا میشود که مصرف حافظه را کاهش میدهد. اگر از نسخه قدیمی یا تنظیمات سفارشی Webpack استفاده میکنید، گزینه زیر را فعال کنید:
experimental.webpackBuildWorker: true۷. غیرفعالسازی cache Webpack
برای کاهش مصرف حافظه، میتوانید cache Webpack را غیرفعال کنید:
config.cache = Object.freeze({ type: 'memory' })۸. غیرفعالسازی آنالیز استاتیک TypeScript
در پروژههای بزرگ، بررسی typeها ممکن است حافظه زیادی مصرف کند. برای غیرفعالسازی در زمان build:
typescript: {
ignoreBuildErrors: true,
}توجه: این گزینه ممکن است باعث انتشار کد دارای خطا شود. توصیه میشود فقط در محیط staging استفاده شود.
۹. غیرفعالسازی Source Maps
Source mapها حافظه زیادی مصرف میکنند. برای غیرفعالسازی:
productionBrowserSourceMaps: false,
experimental.serverSourceMaps: false,
enablePrerenderSourceMaps: false۱۰. بهروزرسانی برای رفع مشکلات Edge Runtime
نسخه ۱۴.۱.۳ مشکل حافظه در Edge Runtime را رفع کرده است. اگر از این runtime استفاده میکنید، به این نسخه یا بالاتر ارتقاء دهید.
۱۱. غیرفعالسازی Preloading در زمان شروع
برای کاهش حافظه اولیه سرور، گزینه زیر را غیرفعال کنید:
experimental.preloadEntriesOnStart: falseجمعبندی
با استفاده از تنظیمات و ابزارهای فوق، میتوانید مصرف حافظه در پروژههای Next.js را بهینهسازی کنید. این اقدامات باعث افزایش پایداری، کاهش خطاهای out-of-memory و بهبود تجربه توسعه میشوند.
نوشته و پژوهش شده توسط دکتر شاهین صیامی