前后端分离的项目：


        前端 HTML 页面通过 Ajax 调用后端的 RESTFUL API 接口并使用 JSON 数据进行交互


JS 渲染的项目：


         通过 Ajax 请求数据以后, 通过 JS 代码动态创建 html 的标签和数据等(一般右键查看网页源代码 是看不到渲染后的 HTML 标签的)



好处： 网络传输数据量小。不占用服务端运算资源（解析模板，模板在前端（很有可能仅部分在前端），改结构变交互都前端自己来了，改完自己调就行。



坏处： 前端耗时较多，对前端工作人员水平要求相对较高。前端代码较多，因为部分以前在后台处理的交互逻辑交给了前端处理。占用少部分客户端运算资源用于解析模板。



后端渲染：



        前端请求，后端用后台模板引擎直接生成 html，前端接收到数据之后，直接插入页面。



好处： 前端耗时少，即减少了首屏时间，模板统一在后端。前端（相对）省事，不占用客户端运算资源（解析模板）



坏处： 占用服务器资源。



前端渲染与后端渲染对比



1、后端渲染



页面呈现速度：快，受限于用户的带宽



流量消耗：少一点点（可以省去前端框架部分的代码）



可维护性：差（前后端东西放一起，掐架多年，早就在闹分手啦）



2、前端渲染



        页面呈现速度：主要受限于带宽和客户端机器的好坏，优化的好，可以逐步动态展开内容，感觉上会更快一点



        流量消耗：多一点点（一个前端框架大概 50KB）当然，有的用后端渲染的项目前端部分也有在用框架



可维护性：好，前后端分离，各施其职，代码一目明了



        编码效率：高，前后端各自只做自己擅长的东西，后端最后只输出接口，不用管页面呈现，



只要前后端人员能力不错，效率不会低