现在很多的前端项目都是单页应用，为了良好的用户体验和前后端分离，我们会单独创建独立的客户端程序。现在已经有了很多成熟的构建客户端应用程序的框架，我们可以直接拿来使用并加以修改成项目需要的，当然，我们也可以完全根据自己的需求去搭建。
默认情况下，可以在浏览器中输出组件，进行生成 DOM 和操作 DOM 来实现用户交互。然而，有时候也可以将同一个组件渲染为服务器端的 HTML 字符串，将它们直接发送到浏览器，最后将这些静态标记”激活”为客户端上完全可交互的应用程序，这就是服务器端渲染。
为什么使用 SSR
与传统 SPA (单页应用程序 (Single-Page Application)) 相比，服务器端渲染 (SSR) 的优势主要在于：
更好的 SEO，由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面。
单页应用的页面都是通过 ajax 去请求数据，动态生成页面，而搜索引擎爬虫因为不能抓取JS生成后的内容，遇到单页应用项目，什么都抓取不到，不利于 SEO，而 SSR 会在服务器端生成页面发送到客户端，查看的是完整的页面，对于像 about 、contact 页等的页面更加方便 SEO。
解决首屏白屏问题。对于缓慢的网络情况或运行缓慢的设备，无需等待所有的 JavaScript 都完成下载并执行，才显示服务器渲染的标记，所以你的用户将会更快速地看到完整渲染的页面。通常可以产生更好的用户体验。
单页应用在第一次加载时，需要将一个打包好（requirejs 或 webpack 打包）的 js 发送到浏览器后，才能启动应用，这样会有些慢。如果在服务器端就预先完成渲染网页后，直接发送到浏览器，这样用户将会更快速地看到完整的渲染的页面，通常会产生更好的用户体验。
SSR 工作流程
由上图可以看到，服务端只生成 HTML 代码，而前端会生成一份 main.js 提供给服务端的 HTML 使用。这就是 React SSR 的工作流程。
《react视频教学》