为什么要叫“前后端分离”、“服务端渲染”

[x77]

• 前后端分离。ChatGPT 的解释：前后端分离是指将传统的 Web 架构中的前端（浏览器端）和后端（服务器端）分离开来，前端负责展示和交互逻辑，后端负责业务逻辑和数据存储等。

从通讯意义上来说，“前后端分离”恰恰是对前后端的通讯做了更好的设计或组织，也就是说前后端连接变得更为有序而不是分离。

• 服务端渲染。ChatGPT 的解释：服务端渲染是指在服务器端将数据和模板结合生成 HTML 文件，并将其发送给客户端浏览器。

从正经的渲染（ render ）概念上来说，渲染是通过程序及图形硬件把数据以图像的形式呈现，就浏览器渲染 HTML 来说，浏览器最终需要吧 HTML 上的文本、图片、音频按照 HTML 的排版在屏幕上渲染出网页图像。

客户端理解前端概念里的“分离”却分离，“渲染”却没渲染，不明白前端为什么要起容易产生歧义的叫法，为什么不用“WebUI”、“服务端生成 HTML”等更为准确（我觉得更准确）更容易表示本质的叫法。

[veike]

我以前也和别人辩论过这个问题，服务器端渲染，本质上就是拼接字符串，没有浏览器图形渲染的过程。如果是 react 和 vue 这些服务器端渲染，本质上也是拼接字符串，没有传统意义上的渲染过程，但是现在大家都这么叫。描述确实容易造成歧义。

我认为还是翻译的问题，例如 Oriented-Object 翻译为面向对象，如果翻译为以对象为导向就容易理解的多。还有 attribute 和 property ，英文翻译把这两个词都翻译为属性，导致 attribute 和 property 在中文语境没有更精确的区分。

[janus77]

可以预见以后会出现越来越多的拿着 GPT 解释的内容来跟人辩论的帖子
从前：“可是百度上说...”
现在本质好像也没变。

[sentinelK]

@adoal
英文不同语境下的相同词汇，不等于中文就一定是相同翻译结果。反过来也一样。

[IvanLi127]

分里指开发分离。

渲染的话，有很多步骤，服务端输出 HTML ，等于做了比较初步的渲染。

[agagega]

因为 render 这个词在英文里除了「渲染」还有「交付」以及「使……成为……」的意思，甚至可以说「渲染」本来就是一个引申义。而汉语的「渲染」本来也是毫无关系的一个词，指的是传统绘画的一种绘画技巧，只是恰好成为了 render 一词的翻译（我记得台湾用的就是另一个词）。

如果你接触计算机的领域广一些，就能在各种英文资料里看到 render 一词，它们并不仅仅狭隘地指「生成具体的图像」这个过程（虽然这个意思用得最多），只要是生成内容的技术，都可以称作广义上的 render.

[james122333]

回应主题好了 渲染可以看维基百科
渲染（英语：render ，或称为绘制或彩现）在电脑绘图中，是指以软件由模型生成图像的过程。
所以应该叫生出模型 而本来功能面就分前后端 以整个产品来看才觉得是一体 这也可以查 wiki
但不觉得这些字眼影响理解

[HerbertNguyen]

前后端分离对应的就是服务端渲染。
在很久以前，是 asp 、php 、jsp 在服务器端生成 html 文件输出给用户的浏览器的，这就叫服务端渲染。不必纠结于“渲染”这个词的意义，咬文嚼字没意义，况且一时半会儿似乎也想不到一个更好的词。这个时候数据和页面结构都是后端在弄，把数据通过模版引擎嵌入到模版里面完事儿。也不存在什么前端工程师，只有切图仔。

后来工程越来越大，复杂性越来越高，才产生了细分。后端只输出数据，到浏览器了再组装成完整 html ，再有什么虚拟 dom 之类的玩意儿。这时候就是所谓的前后端分离。

再发展，前端工程师借助 v8 引擎搞出个 node ，发现性能不错，前端工程师也能干一些后端的活儿了，就又有了“全栈”工程师。

历史总是转来转去。究竟是分离，还是一把梭，还是得看具体工程的复杂度。

[xiaojohn]

看了半天没看懂，所以服务端渲染，是不是在服务器执行的，相当于 jsp

[kingjpa]

@HerbertNguyen 这才是真实答案。

因为以前没有前后端一说， 开发都是每个人 从设计（也不存在设计，都是 table 布局），html css js ,到写 asp php java ，都是一个人干，现在分开了 所以叫前后分离。

在以前 div+css 都是高大上技术，新东西。 因为老网站都是 table 去掉框线做的。

[bhbhxy]

翻译问题吧，render 这个单词，本身就有提供的意思，服务器提供，但是这样翻译不够信达雅。很多场景中文都不会直译，比如 js 的 promise ，翻译过来就是承诺，但不够好听，太直白了啊，于是就有了“期约”这一名词。

[cheng6563]

对于 HTML 来说，填充 DOM/CSS 就叫渲染

[adoal]

@sentinelK 不要泛泛而谈空对空。就 web 开发里的从模板+数据生成页面这件事来说，中文里说的渲染就是直接来自英语里的 render ，而且是老早就有的事，不是 react 和 vue 时代的培训班生造出来的。有一定年岁而且习惯看英文材料的老 web 开发者应该都有印象。

[adoal]

@sentinelK 另外从 OP 的表述来看，他的疑问显然不是翻译问题。如果是翻译问题，那应该是在这个语境里 render 使用合理但翻译成渲染不合理，而他显然是在确认这个语境里英文的 render 和中文的渲染对应的情况下，质疑英文 render/中文渲染这个名字是否能准确表达语义。

[sentinelK]

@adoal 如果是讨论用 render 是否合理的话，我同意你的观点，因为 render 本来就是多个意思，其中有“使之变得 /变成”，所以 render 在信息技术领域不光对应“图像信号的转换”，也对应“HTML 富文本的填充”。

[sentinelK]

至于说中文语境下的“渲染”，我还是保留我自己的意见。我认为这用在 HTML 上，并不是一个合理的翻译。

[adoal]

@sentinelK 有道理

[zhuisui]

对词语咬文嚼字有助于重新正确认识其对应的概念。

[tisswb]

所有解决方案都不是一刀切，有得时候前后端分离很好，然后前端打包成类桌面应用，可以降低浏览器特性变化带来的风险；也有的时候，完全没有必要，还增加维护成本。

[wangxin13g]

写过 jsp 和 php 并且尝试过用 jquery+ajax 获取页面内容替换就不会有这个问题了 XD

[libook]

前后端分离的意思是前后端代码不在一个项目和服务里部署，相对的是早年主流的 PHP 、JSP 、ASP 等技术栈前后端代码是混合在一起的，并且被一起解析运行。简单来说，通常前后端分离的项目就是前端用 React 、Vue 等框架写的纯前端应用，再用 Go 、Node.js 、Java Springboot 等写的纯服务端应用，然后两者使用 HTTP API （ REST 、GraphQL 等设计风格）进行通信。

服务端渲染指的是在服务器渲染成最终页面，相对的是前端（客户端）渲染。比如使用 React 、Vue 等框架开发的前端应用，页面是在浏览器端根据用户访问的前端路径（如 hash 路由）和用户交互来渲染页面，仅与服务器 API 进行数据交换，这种就是前端渲染，特点是不跑 JS 操作 DOM 无法将用户想看的数据呈现出来。在服务器端根据用户请求的路径和 query 参数使用 EJS 、PUG 等模板引擎来渲染页面并返回不需要额外处理就可以直接显示的页面，这种就是服务端渲染，特点是即便用户禁用了 JS 也不影响数据的展示。

当今大多项目都是前后端分离的了，特别是 App 和网站共用后端的项目，但面向 SEO 会额外做一个服务端渲染，因为搜索引擎通常没法直接抓到一个需要前端跑 JS 渲染才能完整呈现信息的页面。