SSR (Server Side Rendering)
SSR 是 "Server-Side Rendering"（服务器端渲染）的缩写。它表示由服务器生成网页的 HTML，并将其发送给客户端，而不是只发送一个空的 HTML 外壳，并依赖 JavaScript 来生成页面内容。
在传统的客户端渲染中，服务器会向客户端发送一个空的 HTML 外壳和一些 JavaScript 脚本，然后从服务器的 API 中获取数据，并用动态内容填充页面。这会导致页面的初始加载时间较慢，不利于用户体验和 SEO。
使用 SSR 后，服务器会生成已经包含动态内容的 HTML，并将其发送给客户端。这使得首屏加载速度更快，并对 SEO 更加友好，因为搜索引擎可以爬取到渲染后的页面。
SSR 加载流程
- 浏览器加载 HTML → 用户立即看到完整内容
- JavaScript 加载完成 → React hydrate（水合），绑定事件交互
- 后续页面导航 → SPA 模式，客户端渲染
优点
- 首屏渲染更快：用户无需等待 JavaScript 加载和执行，浏览器加载 HTML 后即可看到完整内容，而不是在用户访问时才进行渲染。
- SEO 友好：搜索引擎爬虫可以直接抓取
缺点
- 服务器压力大：每次请求都需要服务器生成 HTML，可能会增加服务器的负载，尤其是在高流量情况下。
- 开发复杂度高：需要在服务器端和客户端之间共享代码和状态，可能会增加开发和维护的复杂度。
如何提升首屏性能
- 缓存（Caching）：对静态内容和 API 响应进行缓存，减少服务器渲染的压力，提高响应速度。
- 流式渲染（Streaming Rendering）：服务器可以在生成 HTML 的同时，将内容分块发送给客户端，减少首屏加载时间。