一、引言
在互联网应用开发中，Web开发是最常见的软件开发形式之一。随着技术的发展和应用场景的不断扩大，Web应用的开发模式也在不断演进。不同的开发模式在系统架构、开发方式以及前后端职责划分上都有明显的区别。
从整体架构角度来看，Web开发主要可以分为两种模式：传统Web开发 和前后端分离开发。这两种模式在页面渲染方式、数据交互方式以及系统设计思想上存在较大的差异。理解它们的基本原理和特点，有助于更好地掌握Web应用的开发流程，并在实际项目中选择合适的架构方案。
下面将分别介绍传统Web开发与前后端分离开发的核心思想、优缺点以及它们之间的主要区别。
二、传统Web开发
（一）、传统Web开发的核心思想
前端负责静态页面，后端负责一切。
这里可以细说一下，就相当于，前端只有html页面，后端需要配置页面+资源的路由，需要解析前端页面并动态加载，需要写业务逻辑、数据库、权限控制等等，所有的逻辑都是在服务器后端运行的。
可以这样来说，前端浏览器就是一个显示屏，后端逻辑就是一个cpu，用来控制显示屏的显示逻辑。
（二）、传统web开发的优缺点
优点：
- 架构简单，不需要前端框架。
- SEO友好，搜索引擎更容易抓取HTML。
- 权限控制集中， 传统的Web开发逻辑集中在后端服务器。
- 开发维护简单，这种简单的架构更容易维护。
缺点：
- 前后端耦合严重，修改前端页面必须改动后端代码。
- 页面刷新频繁，用户体验差，每次提交都要刷新页面。
- 前后端交互能力弱。
- 不适合多端应用。
三、前后端分离Web开发
（一）、前后端分离Web开发核心思想
前端负责页面、用户交互、页面路由，后端负责业务逻辑等
这种情况下，前端需要负责的就多了，页面的渲染和路由由前端来实现，后端只负责业务和一些控制。
前后端通过JSON来通信，后端不再返回HTML页面。
（二）、前后端分离Web开发的优缺点
优点：
- 职责清晰，解耦程度高，前后端开发互不影响。
- 开发效率更高，可以并行开发。
- 用户体验更好，每次提交不需要再整页刷新。
- API可以复用。
缺点：
- 架构更复杂。
- SEO不友好。
- 安全和权限设计更复杂。
- 前端开发成本更高。
四、页面渲染方式
（一）、传统 Web
SSR（Server Side Rendering）
服务器生成完整HTML页面。
流程：
浏览器请求
↓
服务器查询数据
↓
服务器生成HTML
↓
返回浏览器
↓
浏览器展示（二）、前后端分离
CSR（Client Side Rendering）
浏览器负责渲染页面。
流程：
浏览器加载前端页面
↓
前端JS请求API
↓
服务器返回JSON
↓
前端渲染页面五、传统 Web 和前后端分离对比
| 项目 | 传统 Web | 前后端分离 |
|---|---|---|
| 页面渲染 | 服务器渲染 SSR | 客户端渲染 CSR |
| HTML | 后端返回 | 前端项目 |
| 页面路由 | 后端 | 前端 |
| 接口 | 后端 | 后端 |
| 数据格式 | HTML | JSON |
| 登录 | Session | JWT / Token |
| SEO | 好 | 一般 |
| 适合项目 | 网站 | Web应用 |