type
Post
status
Published
date
Feb 8, 2026
slug
summary
tags
开发
category
前端开发
icon
password
当用户打开一个网站，能直观看到、可交互操作的界面，就是前端。
而当用户点击操作按钮后，触发的操作验证、数据查询、业务逻辑处理等种种 “看不到” 的操作，都由后端来完成。
你使用的开发技术是比你年龄都大的 JSP，它的特点是把前端 HTML 网页代码和后端 Java 代码混在一起写。
刚开始项目代码不多的时候，你写的很舒服。
但随着项目越做越大，更多同事加入了这个项目的开发，你也渐渐发现了几个问题。
代码混乱难维护：前端后端代码纠缠在一起，不利于阅读，也不利于排查 Bug。
团队协作困难：你在改前端样式，同事在改后端逻辑，经常改着改着就冲突了。
人员要求更高：开发人员必须同时学习前端和后端技术，今天写 CSS 调样式，明天写 SQL 查数据库，根本忙不过来。
部署效率低下：由于前端后端写在一起，哪怕改个按钮颜色都要重新编译部署整个项目。
项目开发效率越来越低，Bug 却越来越多。
什么是前后端分离？
把前端静态文件放在 static 文件夹，JSP 代码放在 jsp 文件夹，这不就是前后端分离吗？
那只是文件夹分离，不是真正的前后端分离。
用户访问网站时，是由后端服务器接收请求，然后在后端查询数据并拼接到 HTML 网页模板中，生成完整的网页，最后再返回给用户。
显然，后端承受了太多！
而如果改造为前后端分离：
- 前端专注于用户界面的呈现和交互逻辑
- 后端专注于数据处理和业务逻辑，不涉及界面代码和网页生成
- 用户在前端进行操作时，前端通过 API 接口 向后端发送请求，由后端处理操作并返回数据给前端，由前端完成数据的最终展示。
前后端分离就是专门解决这些痛点：
1）首先是 代码分离：将前端代码和后端代码完全分开，最好是 2 个独立的项目2）代码分离后，就可以 开发分离：前端和后端程序员可以同时干活，互不干扰。3）还可以 部署分离：前端和后端项目各自独立部署，后端出了问题或者修改了逻辑，不用重新部署前端。4）做到前面 3 个分离后，我们便能实现前后端分离的本质 —— 职责分离
你：前后端分离这么厉害，是不是还能提升网站性能呢？
答：不一定，而且有时前后端分离可能更慢！因为用户访问网站时，浏览器需要先加载前端页面，然后执行 JavaScript 脚本请求后端数据，这比传统的后端直接返回完整页面多了一次网络请求。
但是也别灰心，前后端分离后，前端和后端都可以分别进行优化，更灵活。
原来如此，看来前后端分离的主要目的是 提升开发效率和代码维护性，而不是提升性能。
开始重构项目，前端用 React 框架重写了整个界面，打包成静态文件部署到 CDN 加速网络上；后端则专门提供 API 接口，返回 JSON 数据，部署在独立的服务器上，互不影响。
几个月后，你感受到了前后端分离的优势：
- 团队成员各司其职
- 前端技术灵活选择
- 后端服务多端复用
没有最好的架构，只有相对更合适的架构！是否采用前后端分离，要根据团队项目规模、项目实际需求、团队技术能力等综合决定。
- Author:andre
- URL:http://andrewen.art/article/305e0c9c-a4ea-808a-a6c4-fc5325c130eb
- Copyright:All articles in this blog, except for special statements, adopt BY-NC-SA agreement. Please indicate the source!
