在2020年以前，我所接触的是前后端都在后端(非前后端分离),那个时候浏览器想要什么页面，是由后端决定再返回一个html。之后接触了前后端分离，前端有了自己的服务端，不再是要后端来决定是显示哪个html，并且前后端分离后，各种便利框架，本人用的是VUE。当技术发展到巅峰，在最终依旧会回归本质，这不SSR也就出世了。
什么是服务端渲染（SSR）
SSR是Server Side Render简称；页面上的内容是通过服务端渲染生成的，浏览器直接显示服务端返回的html。
服务端渲染是一种方式，不限定语言，不管是以前的jsp，php，asp.net还是现在的node.js,都可以做服务端渲染的事情。
服务端渲染把一部分的视图业务逻辑交给服务端，这让服务端承受压力。
什么是浏览器端渲染 (CSR)？
CSR是Client Side Render简称；页面上的内容是我们加载的js文件渲染出来的，js文件运行在浏览器上面，服务端只返回一个html模板。
像常用的一些框架：react，vue等都是通过在一个html中用js去控制视图的渲染，操作dom的方式，都是浏览器端渲染。
为什么要使用服务端渲染
一是更好的SEO(seo就是一个中文的缩写，搜索引擎优化)，二是更快的渲染速度。
由于是服务端进行渲染，浏览器只需要渲染出服务端返回的html文件即可,减少了操作dom的时间，这在运行缓慢或者网络不好的设备上，会比较明显。
但是我认为这并不算是值得我们去使用服务端渲染的地方。更好的SEO，才是目前需要使用ssr的真正目的。
关于Vue-SSR
读了vue文档里面关于ssr的内容，里面对实现vue项目的服务端渲染提出了2种解决方案。
一种是使用预渲染（Prerendering），在构建时 (build time) 简单地生成针对特定路由的静态 HTML 文件。这对在项目中需要seo部分完全静态的页面来说是非常高效的。
第二种是使用服务器端渲染（ssr）。需要开启一个node的服务，使用vue-server-renderer插件，把vue项目的内容动态渲染成一个html文档，返回给浏览器，达到了服务器渲染的目的。
vue-server-renderer 依赖一些 Node.js 原生模块，因此只能在 Node.js 中使用。
放图
这张图阐述了vue-ssr，在本地开发环境，与经过webpack打包后生产环境的一些文件结构，与实际的服务端渲染过程。但是在这里我用流程图的方式结合我的个人理解去绘制流程图，阐述一下vue-ssr的简单流程。
vue-ssr与传统的php，jsp的ssr有啥不一样，有啥优势？
我们来看一个php的页面传统ssr
可以看到每一次的页面跳转，浏览器都会获取到一个html文档，每次都进行页面重新渲染的操作，而且每次跳转都会伴随页面的闪烁，体验感非常不好。
再来看vue-ssr，只有在首次访问的时候，浏览器会获取一个已经组织完成的html文档，而后续的页面切换操作，都是基于当前的html获取该路由下的组件js，对页面进行动态渲染，就使用者体验来说，与单页面应用一致，而且也可以满足seo的要求。
vue-ssr与普通的vue开发相比有啥不一样？有啥需要注意的？
这一块，在vue文档中已经说得很清楚了。
一是开发条件所限。一些前端的插件并不能在node下运行，需要经过特殊处理；一些浏览器特定的代码，只能在某些生命周期钩子函数 (lifecycle hook) 中使用。
二是涉及构建设置和部署的更多要求。需要跑一个node程序来对应的服务。
三是更多的服务器端负载。由于把一部分的原本属于浏览器的渲染压力迁移到了node服务端，势必会对服务器性能是种考验。
最后，使用vue-ssr之前还是得想清楚一个问题：你是否真的需要它？
