前端模版渲染和后端模版渲染的优缺点分别是什么？

Question

前两天去面试，被问到前端模版渲染和后端模版渲染的优缺点分别是什么？我表示很不清楚，回来查了一些资料，现在也是不清不楚的，哪位大神能帮我解答一下，先谢过了。

Answer 1

前端模板渲染流程如下：

1. 前端请求一个地址 url

2. 后端接收到这个请求，然后把相应的 html 文件直接返回给前端

3. 前端解析 js 后，然后通过 ajax 向后台获取相应的数据

4. 然后由 js 将这些数据渲染成页面

这样一来，前端与后端将完全解耦，数据使用全 ajax 的方式进行交互，如此便可前后端分离了。前后端分离的好处众所周知。当然也有一些不足之处：

1. 首屏加载缓慢，因为要等 js 加载完毕后，才能进行渲染

2. SEO 不友好

后端模板渲染流程如下：

1. 前端请求一个地址 url

2. 后端接收到这个请求，然后根据请求信息，从数据库或者其他地方获取相应的数据

3. 使用模板引擎（如 java>jsp、 php>smarty）将这些数据渲染成 html

4. 将 html 文本返回给前端

在这个过程中，前端的 html 代码需要嵌入到后端代码中（如 java、 php），并且在很多情况下，前端源代码和后端源代码是在一个工程里的。

所以，不难看出，这种方式的有这样的几个不足：

1. 前后端杂揉在一起，不方便本地开发、本地模拟调试，也不方便自动化测试

2. 前端被约束在后端开发的模式中，不能充分使用前端的构建生态，开发效率低下

3. 项目难以管理和维护，也可能会有前后端职责不清的问题。

Answer 2

首先模板都是要渲染的至于这个渲染是做到前端还是后端很明显偏前端服务器是自己的现在pc手机那么强大干嘛不用一下但是后端模板也有好处首先后端模板如果变化不大可以把页面纯静态化静态的页面速度就非常快了第二是我自己感觉的就是如果有一些敏感数据用在模板里后端渲染的时候这些数据是不需要输出给用户的
                            

Answer 3

前端模板渲染：
比如js通过ajax获取数据，然后用一些js的模板引擎来生成html，比如Underscore.js优点1：后端只用关心数据，减少了后台的计算量。优点2：前台界面的测试更加容易，我直接用静态数据就能驱动一个界面就能进行前台的设计开发。优点3：...暂时没想到，后面想到了再补充。缺点1:可能会增加HTTP请求缺点2：只能使用客户端静态数据，不如后台模板来得强大。缺点3：对搜索引擎不友好。缺点4：即使资源缓存了，仍然需要js运行一遍来生成界面，这样比浏览器直接渲染缓存的资源要慢。
后端模板渲染
前端请求，后端用后台模板引擎直接生成html，比如Java的Freemarker。优缺点和前端模板渲染是反过来的。