要想对比服务端渲染和客户端渲染首先要知道它们的概念?

一、什么是服务端渲染?

我们用传统的 servlet 开发来举例：浏览器请求 servlet，servlet 在服务端生成 html 响应给浏览器，浏览器展示 html 的内容，这个过程就是服务端渲染，如下图：

服务端渲染的特点：

1）在服务端生成 html 网页的 dom 元素。

2）客户端（浏览器）只负责显示 dom 元素内容。

二、什么是客户端渲染?

当初随着 web2.0 的到来，AJAX 技术兴起，出现了客户端渲染：客户端（浏览器） 使用 AJAX 向服务端发起 http 请求，获取到了想要的数据，客户端拿着数据开始渲染 html 网页，生成 Dom 元素，并最终将网页内容展示给用户，如下图：

客户端渲染的特点：

1）在服务端只是给客户端响应的了数据，而不是 html 网页。

2）客户端（浏览器）负责获取服务端的数据生成 Dom 元素。

三、两种方式各有什么优缺点？

3.1 客户端渲染

3.1.1 优点

客户端负责渲染，用户体验性好，服务端只提供数据不用关心用户界面的内容，有利于提高服务端的开发效率。

3.1.2 缺点

不利于网站进行 SEO，因为网站大量使用 javascript 技术，不利于 spider 抓取网页。

3.1.3 适用场景

对 SEO 没有要求的系统，比如后台管理类的系统，如电商后台管理，用户管理等。

3.2 服务端渲染

3.2.1 优点

有利于 SEO，网站通过 href 的 url 将 spider 直接引到服务端，服务端提供优质的网页内容给 spider。

3.2.2 缺点

服务端完成一部分客户端的工作，通常完成一个需求需要修改客户端和服务端的代码，开发效率低，不利于系统的稳定性。

3.2.3 适用场景

对 SEO 有要求的系统，比如：门户首页、商品详情页面等。

**本文首发于CSDN，为博主原创文章，如果需要转载，请注明出处，谢谢！**

完结！