前后端分离演化史

什么是前后端分离？

  前后端分离从职责上进行划分的，前端负责展现交互，后端负责业务处理，分工明确，各司其职，如下所示：

• 前端职责：页面UI，页面展示、交互、渲染，用户体验等；
• 后端职责：数据存储，业务逻辑，RESTful 接口，性能、可用性、伸缩性、扩展性、安全性等；
  

MVC模式

缺点：

1. 前后端代码混杂在一起，前端开发重度依赖后端的开发环境，且部署成本大；
2. 前后端职责不够明确，Controller仍处于灰色地带，页面路由等功能本该由前端决定，由于Controller与Model有交互，且代码混在一起，导致很多情况下由后端实现；
3. 前端静态资源和动态资源没有分离；

Ajax模式（常用）

 后端提供数据接口，前端通过ajax请求调用获取数据，渲染并展现，这种模式简单，使用很广泛，如果没有前端渲染性能压力或者SEO之类的需求，推荐使用这种模式。

优点：

1. 前后端分离，职责明确、部署容易；
2. 前端静态资源和动态资源分离，通过CDN提升性能；

缺点：

1. 代码不能复用。比如后端依旧需要对数据做各种校验，校验逻辑无法复用浏览器端的代码。如果可以复用，那么后端的数据校验可以相对简单化。
2. 性能并非最佳。所有的代码都在浏览器内执行，容易存在性能瓶颈，特别是移动互联网环境下。

Node.js模式

1. 浏览器负责展现交互逻辑。通过 CSS 渲染样式，通过 JavaScript 添加交互功能，HTML 的生成也可以放在这层，具体看应用场景。
2. Node.js负责路由、模板、数据获取、cookie 等功能；

参考：

1. https://github.com/lifesinger/blog/issues/184；
2. http://taobaofed.org/blog/2014/04/05/practice-of-separation-of-front-end-from-back-end/;
3. https://juejin.im/post/58209808da2f60005d0c9c4f