مقایسه SSR با CSR
SSR یعنی تمامی المانهای سایت در سرور رندر شوند و برای ما در قالب فایلهای آماده و قابل نمایش ارسال می شوند. CSR یعنی تقریبا بیشتر المانها سمت کلاینت رندر شوند و عمدتا از تکنولوژی V-Dom استفاده میکنند. نکتهی جالب اینجاست که SSR در ری اکت اصلا شبیه چیزی که در گذشته سراغ داشتیم مثل WordPress ،Laravel ،Asp.net و …. نیست.
مقایسه SSR با CSR
وقتی وب اپلیکیشن ما به صورت CSR یا همان SPA نوشته شود چیزی که crawler گوگل یا موتورهای جستجوی دیگه خواهند دید تنها یک container از نوع html است که خالی است. دلیل خالی بودن آن چیست؟ چون CSR هر آنچه که لازم است را در صفحه ما load شود را در مرورگر کلاینت ایجاد میکند، وقتی کرالر یا همون خزنده برای خواندن مطالب ما میآید چیزی جز یک کانتینر خالی نخواهد دید. پس در بخش CSR عملا SEO رو از دست خواهیم داد. ولی این نکته رو هم باید در نظر گرفت همه بخشهای پروژه ما قرار نیست ssr شود چون ماهیت ری اکت CSR بودن آن می باشد. از این قابلیت باید فقط در جاهایی که نیاز داریم استفاده کنیم. مثلا: بلاگ، محصولات و … رندر سمت سرور در React توسط node js انجام میشود و این فرايند هیچ ارتباطی به بکند پروژه ندارد.
مزایا
- چون تمام پردازشها در سرور انجام میشود و مرورگر فقط اطلاعات رو نمایش میدهد به این صورت سرعت لود صفحات بیشتر میشود و این بیشتر شدن سرعت زمانی که کلاینت سیستم ضعیف شود، خیلی محسوستر است.
- چون سرور در Response برای ما فقط html میفرستد این موضوع باعث میشود که مرورگرهای قدیمی هم بتوانند به راحتی صفحه ما را لود کنند.
- وقتی html خام دارید خزنده گوگل به راحتی به سایت شما میآید و html شما را میخواند و صفحات را ایندکس میکند. گوگل بعضی اوقات عمل رندرینگ را انجام میدهد و برخی از اوقات انجام نمیدهد و اینکه باقی موتورهای جستجوگر جاوااسکریپت را اجرا نمیکنند.
معایب
- پیاده سازی نسبتا سختی دارد.
- کند شدن زمان Response اتفاق میافتد.
حالا باید با این موارد که گفته شد از آن استفاده کنیم یا خیر؟ فقط در جایی که نیاز به سئو دارد باید استفاده شود ولی جاهای دیگری لزومی به استفاده ندارید.
لطفا تجربیات خود را در این زمینه در بخش نظرات برای ما بنویسید.



















بین استفاده از SSR و Static Site Generation کدوم گزینه بهینهتره؟
انتخاب بین SSR و SSG بستگی به نیازهای پروژه شما دارد. اگر نیاز به دادههای پویا و بهروز دارید، SSR مناسبتر است، اما برای سایتهایی که محتوایشان کمتر تغییر میکند، SSG عملکرد بهتری خواهد داشت.
توی پروژههای SPA چطور میشه مشکل سئو رو بدون SSR برطرف کرد؟
در پروژههای SPA برای بهبود سئو میتوانید از روشهایی مانند Pre-rendering و استفاده از متا تگهای مناسب استفاده کنید.
در ریاکت استفاده از Next.js برای SSR بهتره یا باید خودمون بهصورت دستی پیادهسازی کنیم؟
برای پیادهسازی SSR در ریاکت، استفاده از فریمورکهایی مانند Next.js بسیار رایج و کارآمد است و معمولاً نیازی به پیادهسازی دستی نیست.
SSR باعث کند شدن ریکوئستهای API میشه؟
بله، در برخی موارد SSR میتواند باعث کند شدن زمان پاسخدهی API شود، اما این موضوع به پیادهسازی و پیچیدگی پروژه بستگی دارد.
برای سایتهای فروشگاهی که هم سرعت مهمه و هم سئو، بهترین راهکار ترکیب SSR و CSR هست یا استفاده کامل از یکی؟
برای سایتهای فروشگاهی که هم سرعت و هم سئو اهمیت دارند، معمولاً ترکیب SSR و CSR بهترین راهکار است تا از مزایای هر دو بهرهمند شوید.