نکست جی اس

next.js چیست؟ معایب، مزایا و کاربردها

فیس بوک، جاوا اسکریپت و سفارش قهوه در کافی شاپ چه وجه اشتراکی با هم دارند؟ واقعیت این است که شباهت آنها خیلی بیشتر از آنچه فکر می کنید است.

Next.js مانند سفارش دادن قهوه در کافی شاپ است. مشتری وب را به عنوان یک مشتری تشنه که وارد کافی شاپ می شود و باریستا را به عنوان سرور در نظر بگیرید. باریستا از قبل در مورد آنچه مشتری ممکن است بخواهد اطلاع دارد، مردم معمولاً وقتی وارد یک کافی شاپ می شوند قهوه و سایر نوشیدنی های کافئین دار را سفارش می دهند.

مشتری ممکن است اکسپرسو آماده را انتخاب کند، که سفارش آسانی است زیرا تنها کاری که باریستا باید انجام دهد این است که آن را از یخچال در بیاورد و برای مشتری روز خوشی را آرزو کند. مانند وقتی که کلاینت از سرور درخواست ایجاد سایت ایستا (SSG) کرده است که به مراتب سریعترین درخواست ممکن است. سرور برای تکمیل درخواست باید پردازش کمی انجام دهد.

اما وقتی مشتری یک ماکیاتو با سس کارامل، خامه و شکلات می خواهد چطور؟ خوب، در این حالت باریستا باید آستین ها را بالا بزند و دست به کار شود، تا بتواند این معجون دیوانه کننده را آماده کند. این دقیقا مانند زمانی است که مشتری درخواست می کند که یک صفحه در زمان درخواست سفارشی شود. برای انجام این کار سرور باید وارد عمل شود، رندر سمت سرور (SSR) باید محتوای استاتیک را غربال کند، داده های مورد نیاز را واکشی کند، و سپس منابع پردازش را قبل از ارسال آن به سمت کلاینت برای نمایش انجام دهد.

سناریوی سومی هم وجود دارد که البتهما و توصیه نمی کنیم دفعه بعد که می خواهید قهوه سفارش دهید آن را انجام دهید. در این حالت مشتری می‌خواهد قهوه‌ اش را ایرلندی کند. هم باریستا و هم مشتری برای رسیدن به نتیجه نهایی باید کمی تلاش کنند. درست مانند فرآیندی به نام رندر سمت کلاینت(CSR) که در سمت کلاینت و مستقل از سرور انجام می شود.

Next.js چیست؟

یک فریمورک منبع باز است که از React استفاده می کند و برنامه های سمت سرور و سمت کلاینت را برایتان می سازد. یکی از مهم ترین مزایای Next.js سرعت و عملکرد فوق العاده آن است.

در حالی که React تمام محتوا را در مرورگر سمت کلاینت رندر می‌کند،Next.js با فعال کردن برنامه‌ ها برای رندر کردن روی سرور با استفاده از منابع آن، انعطاف ‌پذیری بیشتری از خود نشان می دهد. این فرآیند در مورد برخی از مشکلات رایج مرتبط با رندر React در سمت مشتری به کار برده می شود.

کاربردهای Next.js

روشی که Next.js بر اساس آن صفحات SSG را مدیریت می کند، حتی در صورتی که محتوا به صورت ایستا تولید شده باشد، همچنان واکنشی است. برنامه سمت سرویس گیرنده علیرغم اینکه در واقع کپی و جایگذاری است، تعامل کاملی با محتوا دارد.

صفحات به داده‌های ورودی خاصی وابسته هستند و Next.js این ظرفیت را دارد که تمام ترکیب ‌های صفحه را برای همه ورودی‌ها و متغیرهای داده شده از طریق SSR ایجاد کند. اگر محتوای صفحه دارای ویژگی ‌های حساس به زمان مانند قیمت ‌گذاری سهام و نمودارها یا چیزی ساده‌ تر مانند نوار چت باشد، ممکن است نیاز به به‌ روزرسانی دائمی داشته باشد.Next.js از همه چیز چه مبتنی بر سرور یا مشتری مراقبت می کند.