前言
ssr即服务器端渲染，是一个有利于SEO，及首屏加载等优势的一种view层的处理。ssr简单来说就是在保持前后端分离的开发模式下，在前后端中间加一个node中间层，在node中间层对页面数据进行组装，即node层去请求后端数据，然后在html模板进行填充，完了之后就返回给客户端。缺点也有，可以参考官方文档。选取时，最好综合考虑。
为什么会出现这种技术？
当前SPA应用是彻底的将内容变成服务器端的一种服务，后端对于前端来说，就是提供动态数据的服务人员。SPA技术将内容和模板的结合放在浏览器端，内容是通过ajax异步获取的。这样的话，根据搜索引擎原理，必然导致SEO很烂。同时，如果客户端网络环境差，也会延长内容到达时间。SSR就是来解决这个问题的。这项技术已经经过充分实践了，最典型的例子就是手机淘宝app，据淘宝内部团队人员透露，目前手机淘宝app里绝大部分的页面都是SSR技术，即他们口中所说的，在服务器端和客户端之间加一个node中间层来渲染页面，手机淘宝的体验，相信绝大多数中国人都是有体验的，非常完美。
核心思想
在node层进行内容数据预取，然后在html模板中进行填充，返回客户端进行展示。
vue SPA应用的SSR构建
将spa应用处理为ssr的模式，还是有很大的复杂性的。当然，社区繁荣一片的现在，你可以使用开源的NUXT.js，来做ssr处理。要想自己有更多的项目结构控制权的话，就需要知道这些东西是怎么根据构建工具串起来的了。在我经过了几天学习官方文档之后，我试着总结一下这个串接过程。在讲述串接过程前，先需要知道vue作者的ssr构建的设计。
首先顶层上，有1个工具叫vue-server-renderer。这个模块负责支持整个构建过程必要环节的处理。这个工具下，提供了一些模块和api。在一个基本的构建过程中需要用到的有：
api: createBundleRenderer // 创建renderer，renderer的作用是将vue实例渲染成html
模块：client-plugin和server-plugin // webpack插件，分别处理客户端打包和服务器端打包
为了将相同的应用程序提供给客户端，我们使用webpack来打包构建。ssr同样也需要打包构建。因此作者的基本思路就是，对服务器端渲染打包成一个bundle，对客户端程序打包成一个bundle。在客户端发起请求的时候，返回服务器对应的渲染页面和客户端bundle，由于服务器端渲染页面已经留下了静态标记，客户端bundle会识别这个标记，并以混合模式挂载（具体怎么实现的需要去阅读源码）。
最后输出应用程序
有了构建工具构建出来的工件，可以进一步输出程序。基本思路是借助createBundleRenderer根据打包好的bundle创建一个renderer，然后在node服务器的帮助下，根据请求路径来确定一个context上下文对象，renderer再依据这个context，返回必要的静态资源给客户端用于展示。