浅谈服务端渲染（SSR）

这几天服务端渲染在知乎上热度又上来了，于是我又去翻看了一些相关资料。

服务端渲染是什么

我最开始接触是在Vue的官网上，开始是作为一个小节出现，现在已经是个专门的大章节来专门讲Vue服务端渲染的内容。

服务端渲染 简单来说就是在服务器上把数据和模板拼接好以后发送给客户端显示。

回顾下前端的历史，最开始的站点是简单的静态网站。后端大哥把.html文件推送给用户，用户浏览器解析这些字符串进行显示。那个时候就是 服务端渲染 。可是后来由于网站内容越来越复杂、特效越来越炫酷，这种‘兼职’状态已经不能满足需求，细分之下的前端出现了。

随后为了方便的开发，开始提倡 前后端分离，大家各做个的，彼此之间通过基于HTTP的各种API协作，变成了数据动态生成的新一代站点。

再后来出现了Vue等三大MV*框架，网站做成了SPA应用，解决了很多问题的同时也带来了新问题，其中最突出的两个：难以SEO和首屏加载缓慢。

服务端渲染解决了什么

难以SEO
SPA网站们不仅数据是动态生成的，连大部分DOM节点都是动态生成的，后台只提供一个基本模板，而内容需要等到各种JS文件在客户端下载运行完成以后才能显示。
而搜索引擎目前并不会去下载这些JS文件来爬数据（据说 Google 已经有了这项技术并在使用，百度也能这样做但没做），那么在搜索引擎改变策略前，总得想点办法。

时尚就是轮回，现在前端竟然也有这个现象...那么大神们想到了办法：那就让我们回到老路上吧。

得益于Node.js的出现，不需要后台做太多，把数据和模板在中间服务器上进行组装，再发送给客户端。这样的模式解决了问题又没有让大家倒退回去，大厂们冲锋在前，提出各种实践方案，这里有美团的大神发布的两篇文章：

美团点评点餐前后端分离实践——一个可能没用现成框架
美团点评点餐 Nuxt.js 实战——一个用了Nuxt.js框架

珠玉在前，我也说不了太深，有兴趣请看文章。

首屏加载缓慢
随着前端的发展，业务逻辑越来越复杂，代码也越来越厚，各种JS文件越来越大，当一个网页打开，所有东西都下载完页面能打开，白屏时间越来越长。

为了解决这个问题，代码模块化 和 按需加载、占位图 和 预展示 纷纷开始应用，从不同的角度削减了问题程度。但是服务端渲染同样也是解决这个问题的角度之一，由于不少资源在中间服务器上进行拼接，节省了客户端的不少时间，效果也很不错。

服务端渲染有什么缺点

在解决问题的同时同样也有一些成本是必须要考虑的。

首先是 技术成本，中间增加了这些环节当然要多更多的时间或更多的人来完成，并且还有不少坑要踩。

然后很多计算从客户端移到服务器上，对服务器的压力增加，特别是高并发时会给服务器的 CPU 带来更大的负载。

结语

我个人觉得用不用、怎么用依然得看需求和取舍，技术是工具，主要还是看人。

转自：https://www.jianshu.com/p/3e62641eb381