服务端渲染和客户端渲染的区别

一、服务端渲染和客户端渲染概念

1. 服务端渲染(SSR):
   在服务器端完成把数据和模板转换成最终的 HTML文件，然后浏览器接收到这个文件，就可以直接解析展示。
2. 客户端渲染(CSR):
   一个网页是由 JS 在客户端渲染出来的，而不是服务器直接返回回来的。

二、SPA、SEO及服务器页面缓存

1. SPA: 单页面应用：只有一张Web页面的应用，单页面跳转仅刷新局部资源，公共资源仅需加载一次，常用于PC端网站，购物等网站。

优点：用户不用刷新页面，减少了服务器的压力,适合前后端分离开发.
缺点：首屏打开慢，不利于SEO搜索引擎优化。

2. SEO: 搜索引擎优化，利用搜索引擎的规则提高网站在有关搜索引擎的自然排名

因为SPA单页面应用，是通过AJAX获取数据，这就难保证我们的页面能被搜索引擎收到，并且有一些搜索引擎不支持js和通过ajax获取数据。那就更不用提SEO了R。

3. 服务器的页面缓存: 将动态页面直接生成静态的页面放在服务器端，用户调取相同页面时，静态页面将直接下载到客户端，不再需要通过程序的运行和数据库的访问，大大节约了服务器的负载。

二、服务端渲染和客户端渲染优缺点

1.服务端渲染:

优点:

(1) 不占用前端的资源,前端耗时少,尤其是移动端，也可以更省电。
(2) 有利于SEO。因为在后端有完整的html页面，所以爬虫更容易爬取获得信息
(3) 使用服务器页面缓存，这样就可以减少数据库查询浪费的时间了，且对于数据变化不大的页面非常高效 。
缺点:
(1) 不利于前后端分离，开发效率低。
(2) 占用服务器端资源，对html的解析，对前端来说加快了速度，但是加大了服务器的压力。

1.客户端渲染:

优点:

(1) 前后端分离，开发效率高。
(2) 用户体验更好，我们将网站做成SPA（单页面应用）或者部分内容做成SPA，当用户点击时，不会形成频繁的跳转。
缺点:
(1) 前端响应速度慢，特别是首屏。
(2) 不利于SEO.

总结

根据具体的实际情况进行选择渲染方式，比如企业级网站，主要功能是展示而没有复杂的交互，并且需要良好的SEO，则这时我们就需要使用服务器端渲染；而类似后台管理页面，交互性比较强，不需要seo的考虑，那么就可以使用客户端渲染。
另外，具体使用何种渲染方法并不是绝对的，比如现在一些网站采用了首屏服务器端渲染，即对于用户最开始打开的那个页面采用的是服务器端渲染，这样就保证了渲染速度，而其他的页面采用客户端渲染，这样就完成了前后端分离。