சேவையகப் பக்க ரெண்டரிங் (Server Side Rendering - SSR)

பொதுவாக, பயனர் ஒரு வலைத்தளத்தைப் பார்வையிடும்போது, உலாவி சேவையகத்திற்கு ஒரு கோரிக்கையை அனுப்புகிறது, இது HTML, CSS மற்றும் ஜாவாஸ்கிரிப்ட்டுடன் பதிலளிக்கிறது. ஆனால் React மற்றும் Vue போன்ற நூலகங்கள் (libraries) மூலம், சேவையகம் ஜாவாஸ்கிரிப்ட் கோப்புடன் வெற்று HTML பக்கத்தை மட்டுமே அனுப்புகிறது. ஜாவாஸ்கிரிப்ட் கோப்பு பின்னர் உலாவியில் பக்கத்தை ரெண்டர் செய்கிறது. இது கிளையன்ட் பக்க ரெண்டரிங் (Client Side Rendering - CSR) என்று அழைக்கப்படுகிறது.

சேவையகப் பக்க ரெண்டரிங் (Server Side Rendering - SSR) என்பது சேவையகம் கோரிக்கையைச் செயலாக்கி, ரியாக்ட் (React) அல்லது வ்யூ (Vue) கூறுகளிலிருந்து சேவையகத்தில் HTML ஐ உருவாக்கும் ஒரு நுட்பமாகும். சேவையகம் உருவாக்கப்பட்ட HTML ஐ உலாவிக்கு அனுப்புகிறது, அது ஜாவாஸ்கிரிப்ட் ஏற்றப்படும் வரை காத்திருக்காமல் பக்கத்தை ரெண்டர் செய்ய முடியும்.

SSR ஐ ஏன் பயன்படுத்த வேண்டும்?

CSR ஐ விட SSR ஐப் பயன்படுத்துவதில் பல நன்மைகள் உள்ளன:

• SEO-க்குச் சிறந்தது (Better for SEO): உங்கள் வலைத்தளத்தின் உள்ளடக்கம் சேவையகத்தில் ரெண்டர் செய்யப்பட்டால் தேடுபொறிகள் (Search engines) அதை எளிதாகக் க்ரால் (crawl) செய்து அட்டவணைப்படுத்தலாம் (index). இது சிறந்த தேடுபொறி தரவரிசைக்கும் தேடுபொறிகளிலிருந்து அதிக ட்ராஃபிக்கிற்கும் (traffic) வழிவகுக்கும்.

• வேகமான ஆரம்பப் பக்க ஏற்றம் (Faster initial page load): HTML சேவையகத்தில் உருவாக்கப்படுவதால், பக்கத்தை ரெண்டர் செய்வதற்கு முன் ஜாவாஸ்கிரிப்ட் ஏற்றப்படும் வரை உலாவி காத்திருக்க வேண்டியதில்லை. இது ஆரம்பப் பக்கத்தை வேகமாக ஏற்றும் நேரத்திற்கு வழிவகுக்கும்.

• குறைந்த-நிலை சாதனங்களில் சிறந்த செயல்திறன் (Better performance on low-end devices): HTML சேவையகத்தில் உருவாக்கப்படுவதால், பக்கத்தை ரெண்டர் செய்ய உலாவி அதிக வேலை செய்ய வேண்டியதில்லை. இது மொபைல் போன்கள் மற்றும் டேப்லெட்டுகள் (tablets) போன்ற குறைந்த-நிலை சாதனங்களில் சிறந்த செயல்திறனுக்கு வழிவகுக்கும்.

SSR இன் தீமைகள்

SSR ஐப் பயன்படுத்துவதில் சில குறைபாடுகளும் உள்ளன:

• மிகவும் சிக்கலான மேம்பாட்டுச் செயல்முறை (More complex development process): SSR க்கு சேவையகப் பக்கத்தில் அதிக வேலை தேவைப்படுகிறது, இது மேம்பாட்டுச் செயல்முறையை மிகவும் சிக்கலாக்கும்.

• அதிக சேவையக வளங்கள் (More server resources): SSR க்கு அதிக சேவையக வளங்கள் தேவைப்படுகின்றன, இது அதிக ஹோஸ்டிங் (hosting) செலவுகளுக்கு வழிவகுக்கும்.

• வரையறுக்கப்பட்ட கிளையன்ட் பக்கச் செயல்பாடு (Limited client-side functionality): jQuery அல்லது Bootstrap போன்ற கிளையன்ட் பக்க நூலகங்களைப் பயன்படுத்த SSR உங்களை அனுமதிக்காது, ஏனெனில் அவை சேவையகத்தில் கிடைக்காது.

SSR ஐ எவ்வாறு செயல்படுத்துவது?

ஒவ்வொரு நூலகமும் SSR ஐச் செயல்படுத்த அதன் சொந்த வழியைக் கொண்டுள்ளது. எடுத்துக்காட்டாக, React க்கு, நீங்கள் Next.js அல்லது Gatsby ஐப் பயன்படுத்தலாம். Vue க்கு, நீங்கள் Nuxt.js ஐப் பயன்படுத்தலாம். Svelte க்கு நீங்கள் SvelteKit ஐப் பயன்படுத்தலாம்.