对于前端技术，早年指HTML、CSS，后来又加上JavaScript，现在更进一步增加了框架（Vue、React、Angular）与类库（JQuery、Ajax、NodeJS）。
第一阶段，前端、后端耦合。前端只负责HTML、CSS来做静态页面，JSP、PHP后端程序员负责将这些静态网页输出给浏览器，并增加动态部分。这样做的好处在于每次交给客户端的为完整处理好的页面，减轻了浏览器的负担，也便于SEO。此时前端工程师只要学会HTML、CSS即可做静态网页，被戏称为切图仔；后端工程师则被称为全栈工程师，既需要些后端代码，也需要调用前端静态代码并完成其中动态部分。但是耦合太严重。1）代码、功能方面，大量的前端代码、功能在后端。2）客户端、服务器压力大，每次刷新页面都要重新全部请求。
第二阶段，半分离阶段。前端采用HTML+CSS+JavaScript来构建网页。随着JavaScript的不断完善，JQuery、Ajax库的诞生与推广，逐渐出现了半分离架构。HTML+CSS来构建静态部分，JavaScript来请求显示与修改上传数据。这样后端专注于数据库的实现、后台逻辑处理、数据接口实现，前端专注于界面的显示优化。这一阶段依然有不少问题，JQuery、Ajax依然导致JavaScript的使用不便，前端代码由于JavaScript的加入逐步混乱；此外，这种情况只考虑了单页面的应用，并未考虑路由等问题。再加上国内的搜索引擎只会抓取静态页面内容，导致SEO效果不好。
第三阶段，全分离阶段。随着移动互联网发展，手机流量的日趋需要，人们需要在第二阶段的半分离架构上进一步改进。一是NodeJS的崛起，完成了路由控制；另一方面，框架（Vue、React、Angular）的诞生对前端的开发与代码维护起到了极大的促进作用。在这一阶段不仅仅实现了半分离阶段解耦合，也进一步完成了路由、SEO与前端高效开发。
综上所述，前端后端的发展过程，是JavaScript语言的崛起过程。JavaScript语言与前端框架（vue、react、angular）的崛起，导致了前端、后端的分离，前端专注于美观、流畅、SEO，后端专注于高并发、高性能、高可用。
前端后端分离的核心作用在于解耦合：
1、减轻了服务器压力，重新请求只需要请求动态部分即可。
2、代码与功能的分离，便于软件工程模式管理，提高工作效率。
前后端分离原因：
1、在PC互联网时代，每次请求同一个页面，都要请求全部数据，并非请求部分动态数据。这样一方面增加了服务器的压力，另一方面增加了客户端的流量。PC上网，并不关心流量的耗费，移动互联网则关注流量耗费。这样，静态与动态的解耦合势在必行。
2、早期的JavaScript功能并不强悍，导致原有的很多功能无法快速便捷实现。JavaScript诞生于1995年，Ajax诞生于1998年，而简化JavaScript应用的JQuery库2006年才诞生，三大前端框架（Vue、React、Angular）基本在2010年后诞生。
3、移动互联网的发展，手机等设备的芯片处理能力越来越强，完全能正常运行JavaScript的类库与框架。
来源：https://blog.csdn.net/wghhdzwzqbx02/article/details/87263382