در نوشته قبلی گفتیم که اپ های ری اکت دو تا نکته منفی دارن. اول اینکه سرعت لود اولیه بالاست چونکه کل اپ ارسال میشه به کلاینت و دوم اینکه چونکه کلاینت در ابتدا یک قالب HTML خالی را در مرورگر اجرا میکنه از نظر SEO وب سایت ما بسیار ضعیف خواهد بود.. خب ببینیم Next js اینجا برای حل این دو مشکل چه کاری میتونه برای ما انجام بده.
همانطور که میدونیم بحث Routing در Next js بر اساس نام فایل هست در پوشه ای با نام pages ، به اینصورت که فایل index.js میشه صفحه اصلی وبسایت ما و فایل های دیگه میشن صفحه های دیگر وب سایت ما که بر اساس نامشون مسیر دهی میشن. مثلا اگر یک فایل داشته باشیم با نام about.js ، برای اینکه کاربر بتونه این صفحه را ببینه باید آدرس را به این صورت وارد کنه : https://our-domain/about و هر page چیزی نیست جز یک کامپوننت ری اکت.
حالا اگر کاربر درخواستی برای یکی از صفحه های وب سایت ما داشته باشه مثلا همین صفحه about را براش درخواست داده .. آنوقت Next js عزیز و دوست داشتنی تمام اپ را براش نمیفرسته. فقط همین صفحه ای که کاربر درخواست داده را به سمت کلاینت ارسال میکنه و بدین گونه لود اولیه اپ ما بالا نخواهد بود چونکه فقط یکی از صفحه های اپ ما اجرا شده ، پس مشکل لود اولیه حل میشه بدین صورت ، حالا بریم ببینیم که بحث SEO را چطوری Next js هندل میکنه.
در Next js اجرا یا رندر در سمت سرور اتفاق می افتد یعنی قالب HTML ما در سمت سرور ساخته میشه و بعد ارسال میشه به کلاینت برای نمایش به کاربر، بدین صورت یک صفحه ای با محتوا ارسال شده سمت کلاینت لذا الگوریتم های موتورهای جستجو مانند گوگل با یک صفحه با محتوا مواجه هستن و آنرا نادیده نمیگیرن.
این بحث رندر در سمت سرور در Next js خودش دو نوع هست : SSG و SSR که هر کدام جذابیت های خاص خودشون رو دارن و در پست بعدی با جزئیات صحبت خواهیم کرد.
