SSR代表服務器端渲染（Server Side Rendering），這里主要以React為目標討論這個話題，但是對其他框架也有參考意義。
關於SSR你需要關注：
1. 首次重要的繪制。單靠SSR並不能保證良好的效果，還需要關鍵的CSS和靠近客戶端。
2. 支持SEO，支持Twitter和Facebook等其他機器人
3. 優雅的退化。這樣能確保你的服務在沒有JS的情況下也是可用
有什么難的？
SSR就像一個新的維度，無論你使用什么，你都需要為SSR重新配置。
1. 用componentDidMount來獲取數據嗎？你就需要使用類似getInitialProps（來自next.js或after.js）或狀態管理庫（如Redux），這些要放在服務器上運行。
2. 用Router嗎？你需要在服務器上配置它
3. 用i18n嗎？你需要在服務器上配置它
4. 使用HMR嗎？你需要為瀏覽器和服務器重新加載代碼
5. 用react-helmet嗎？需要在服務器上配置它
6. 是否使用react-loadable？需要配置服務器以傳遞使用的模塊，這樣客戶端可以預加載它們
7. 使用Redux嗎？您需要序列化存儲並將其傳遞給客戶端
8. 使用CSS-in-JS嗎？需要在服務器上配置它，生成關鍵CSS並在HTML響應中內聯它
不要以為這些都是可以解決的，好像Next.js和Razzle已經解決了大部分問題，我想告訴你的是SSR如何將所有事情加倍（另一個維度），並且大部分時間都需要樣板來處理所有事情。
第一次重要的繪制
如果正在進行SSR，這並不意味着你能獲得開箱即用的第一次重要的繪制。
1. 你的設置是否有為第一個字節這是好時間？如果你的服務器運行緩慢或過載 - 你會遇到問題，確保使用最新節點，縮小服務器代碼，使用流式渲染，優化子查詢（數據庫或網絡）（如果有）。
2。 你提供關鍵的CSS嗎？否則，瀏覽器無法開始呈現頁面。
3. 你使用網絡字體嗎？如果是的話，你會優化嗎？
4. 服務器是否靠近客戶端？如果您的服務器在歐洲，但客戶端在日本，SSR將無法幫助您。使用CDN服務，但是如果由於法律限制而無法將服務器移近客戶端怎么辦？
5. 你確定沒有不必要的重定向嗎？重新定向減慢速度。
6. SSR不是第一次重要繪制渲染的銀彈。如果你的后端很慢或很遠，你需要檢查"shell"包括CDN是否能更好地工作。你可以使用react-snap之類的東西來預呈現靜態頁面並為其他頁面生成“shell”。
7. 如果您的網站更加靜態，您可以使用預渲染而不是SSR。使用react-static或gatsby或react-snap。
SEO
這里有3個選項：
1. SSR
2. 預渲染，如react-snap, react-static, gatsby 等。
3. 根據需求進行預渲染，如rendertron，puppetron，pupperender等。
如果可以，請選擇預渲染。如果您唯一關注的是SEO，那么隨時都可以輕松使用預渲染。
優雅的退化
這個很棘手，這真的取決於你想要降到多少級？
1. 你想支持鏈接嗎？
2. 是否想要支持下拉菜單，就像在https://www.seek.com.au/中一樣？你需要使用CSS和復選框的一些技巧
3. 你想要支持表格嗎？除了現有的JSON API之外，您還需要端點來處理這些表單
4. 沒有JS的一些功能非常難，比如組合框或地圖
結論
SSR很好，試一試。請確保您的用戶真正從中受益。
如果您不能使用SSR而是嘗試預渲染器，有時它是最簡單的選擇。