服务端渲染SSR

服务端渲染SSR

我们常见的网站渲染的方式已经迭代替换了很多总了，在最早以前的远古时期时，所以我们就要了解客户端渲染CSR和服务端渲染SSR

传统的Web开发 – (发请求，返回html)

由客户端发起一个请求，服务端再将拿到的数据和模板（asp，art-template）等等，直接将数据填充在一个模板里面，再将这个一大个模板返回给前端，浏览器就相当于是打开了一个界面。这个就是最最传统的一个Web开发的流程了

这种开发如果我们查看页面的源代码(并不是查看页面的elements) 是能够看清晰的一层层的DOM结构的，也就是一个完成的html代码结构

这种开发也渐渐的被替代了，原因主要有：

• 服务器一次返回一整个页面给浏览器，如果网络不好的时候回造成时间要比较久
• 不够友好

SPA时代 – (单页面应用)

在访问的时候只返回一个html的基本结构（非常非常小的无内容的壳），接着发送AJAX请求向服务器要数据再渲染到这个空壳上

SPA应该查看页面的源代码的时候返回的源码基本是只有一个id=APP的空壳

SPA应该也有缺点：

• 首屏渲染时间比较长，必须等待JS加载完毕，并且请求结束（因为会发多次的ajax请求）再渲染页面，这个会造成等待时间偏长
• seo（爬虫不好）不友好，因为访问页面源代码的时候只有空壳，百度和其它的爬虫只拿到一个空壳是没有办法判断这个页面到底是干什么的，不以利网站的宣传。

SSR

为了解决以上的两个问题，一些应用就会使用SSR，可以简单的理解成，这种方式就是在传统的应用和SPA应用之间做的一个折中的选择。
服务器在接收请求的时候就先根据url来拿到vue路由下的哪个模板，再直接的讲模板需要的数据填充进去，最后将这个模板给返回，页面就不需要一直发请求了。

注意点：

• 服务端渲染并不是所有的页面都去渲染，只有一个首屏会去渲染，她其它的地方任然还是一个SPA应用，后续浏览器再路由跳转等等的时候就和之前的SPA应用没有区别了。html的结构不会发生巨大的变化了。
• 首屏也不一定是首页，而且会带着路由相关的配置，和JS文件一起返回