服务器端渲染 (SSR)

Vue.js 是构建客户端应用程序的框架。默认情况下，可以在浏览器中输出 Vue 组件，进行生成 DOM 和操作 DOM。然而，也可以将同一个组件渲染为服务器端的 HTML 字符串，将它们直接发送到浏览器，最后将这些静态标记”激活”为客户端上完全可交互的应用程序。

服务器渲染的 Vue.js 应用程序也可以被认为是”同构”或”通用”，因为应用程序的大部分代码都可以在服务器和客户端上运行。

与传统 SPA (单页应用程序 (Single-Page Application)) 相比，服务器端渲染 (SSR) 的优势主要在于：

更好的 SEO，由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面。

请注意，截至目前，Google 和 Bing 可以很好对同步 JavaScript 应用程序进行索引。在这里，同步是关键。如果你的应用程序初始展示 loading 菊花图，然后通过 Ajax 获取内容，抓取工具并不会等待异步完成后再行抓取页面内容。也就是说，如果 SEO 对你的站点至关重要，而你的页面又是异步获取内容，则你可能需要服务器端渲染(SSR)解决此问题。

更快的内容到达时间 (time-to-content)，特别是对于缓慢的网络情况或运行缓慢的设备。无需等待所有的 JavaScript 都完成下载并执行，才显示服务器渲染的标记，所以你的用户将会更快速地看到完整渲染的页面。通常可以产生更好的用户体验，并且对于那些「内容到达时间(time-to-content) 与转化率直接相关」的应用程序而言，服务器端渲染 (SSR) 至关重要。

https://ssr.vuejs.org/zh/#%E5%85%B3%E4%BA%8E%E6%AD%A4%E6%8C%87%E5%8D%97

npm install vue vue-server-renderer –save
渲染一个 Vue 实例
与服务器集成
npm install express –save

Source部分就是我们所编写的源代码，所有代码有一个公共入口，就是app.js，紧接着就是服务端的入口
（entry-server.js）和客户端的入口（entry-client.js）。当完成所有源代码的编写之后，我们通过webpack的构建，打包出两个bundle，分别是server bundle和client bundle；当用户进行页面访问的时候，先是经过服务端的入口，将vue组建组装为html字符串，并混入客户端所访问的html模板中，最终就完成了整个ssr渲染的过程。

https://segmentfault.com/a/1190000019618170

https://segmentfault.com/a/1190000016637877?utm_source=tag-newest