未分离
前端职责：
在以前传统的网站开发中，前端一般扮演的只是切图的工作，只是简单地将UI设计师提供的原型图实现成静态的HTML页面，而具体的页面交互逻辑，比如与后台的数据交互工作等，可能都是由后台的开发人员来实现的，或者是前端是紧紧的耦合后台。
后端职责：
有可能后台人员直接兼顾前端的工作，一边实现API接口，一边开发页面，两者互相切换着做，而且根据不同的url动态拼接页面，这也导致后台的开发压力大大增加。
开发模式：
方式一：
方式二：
使用技术：servlet+jsp/各种模板引擎
Servlet
我们编写java程序想要在网上实现 聊天、发帖、这样一些的交互功能，普通的java技术是很困难的。sun公司就提供了Serlvet这种技术供我们使用。它可以接收浏览器发过来的http请求，取得一些参数经过一些处理后，返回用户想要的信息。
Jsp
- JSP是一种基于文本的程序，其特点就是HTML和Java代码共同存在！
- JSP是为了简化Servlet的工作出现的替代品，Servlet输出HTML非常困难，JSP就是替代Servlet输出HTML的。
缺点：
- 前端无法单独调试
- 后端代码侵入到前端代码
- jsp运行加载响应慢问题
结果：
前端紧紧的依赖后端，前后端工作分配不均。不仅仅开发效率慢，而且代码难以维护。
开发模式是，前端写好静态demo，后端拿到demo，嵌套进jsp 添加一些jsp脚本 指令 表达式用来获取后端数据并展示
半分离
步骤：
- 浏览器请求，cdn返回html页面
- html中的js代码以ajax方式请求后台的接口
- 接口返回json数据，页面解析json数据，通过dom操作渲染页面
前端职责：
前端负责开发页面，通过接口（Ajax）获取数据，采用Dom操作对页面进行数据绑定，最终是由前端把页面渲染出来。
后端职责：
专注于实现业务逻辑，即使在这一时期，通常也是一个工程师搞定前后端所有工作。
使用技术：ajax dom jquery json?
Ajax
关于什么是ajax，因为它涉及到很多技术，比较难说清楚，因此主要关注一下
ajax能做什么，概况来说就是客户端与服务器，可以在【不必刷新整个浏览器】的情况下，与服务器进行异步通讯的技术
在我们之前的开发，每当用户向服务器发送请求，哪怕只是需要更新一点点的局部内容，服务器都会将整个页面进行刷新。
- 性能会有所降低(一点内容，刷新整个页面！)
- 用户的操作页面会中断(整个页面被刷新了)
ajax可以做到局部刷新，不用重新加载网页，大大提高网页加载速度和交互体验！
前端通过ajax拿到数据后就可以自由操作dom节点了。
Dom
比如一个注册页面的输入框，提示框，提交按钮等
Jquery
jquery是一个优秀的JavaScript代码库，用于高效操作dom节点
Json
一种轻量级的数据交换格式，是JavaScript的一个子集
几乎所有编程语言都有解析JSON的库，很多开发框架都提供了将一般数据转换为json格式的数据的支持，这样就可以降低前后端数据沟通成本
优点：
前端不会嵌入任何后台代码，前端专注于html、css、js的开发，不依赖于后端。自己还能够模拟json数据来渲染页面。发现bug，也能迅速定位出是谁的问题，不会出现互相推脱的现象。
缺点：
- javascript存在大量冗余，在业务复杂的情况下，页面的渲染部分的代码，非常复杂。
- 在json返回的数据比较大的情况下，渲染的十分缓慢，会出现页面卡顿的情况
- seo非常不方便，由于搜索引擎的爬虫无法爬下js异步渲染的数据，导致这样的页面，SEO会存在一定的问题。
- 资源消耗严重，在业务复杂的情况下，一个页面可能要发起多次http请求才能将页面渲染完毕。
为什么是半分离？
前端和后台同时开发时，就可能遇到前端已经开发好一个页面了，可是却等待后台api接口的情况。比如说A是负责前端，B是负责后台，A可能用了一周做好了基本的结构，并且需要API接口联调后，才能继续开发，而此时B却还没有实现好所需要的接口，这种情况
前端自己手上没有测试数据，无法模拟线上开发环境
分离
引入Node.js
引入nodejs主要是为了分层开发，职责划分。
nodejs作为前端服务器，由前端开发人员负责，前端开发人员不需要知道java后台的api接口是如何实现的，前端只需要关心前端的开发工作，并且管理好nodejs前端服务器，而后台开发人员也不需要考虑如何前端是如何部署的，他只需要做好自己擅长的部分，提供好API接口就可以前端可以使用node.js生成假数据，不需要等待后端的api完成就可以模拟线上开发环境
数据和视图绑定
过多的js代码操作dom会造成大量冗余，代码结构杂乱无章，不好维护，为了解决这个问题，前端三大框架(Vue React Angular)运营而生。
他们的核心思想是将数据(Model)和视图(View)进行绑定。
vue还可以使用组件技术组织网页中的各个模块，看起来更加有序，好维护
由此开始前端正式和后端说再见了
微服务
前端和后端划清关系之后，后端更加注重处理自己的业务逻辑
随着应用更加复杂，功能划分更细，需要将一个大的系统拆分成小系统，每个小系统都可以对外提供一种类型的服务，微服务逐渐兴起。
正如前端有vue全家桶 java后台有sring全家桶
